在我的 Rails 项目中,我有 HTML 文件
<a href='#' id="show_advanced">Show advanced options</a>
然后在 JavaScript/JQuery 中
jQuery("#show_advanced").click(function() { // if link is clicked
event.preventDefault(); // don't go to another page
if (jQuery('.advanced_option').is(':hidden')) { // if it is hidden, slide down
jQuery('.advanced_option').slideDown();
jQuery("#show_advanced").html("Hide advanced options");
} else { // if not, slide up
jQuery('.advanced_option').slideUp();
jQuery("#show_advanced").html("Show advanced options");
}
});
显示表单的高级选项。在 Chrome 中,这工作得很好。但在 FireFox 中,该链接只会将我带到页面 .../#
,这不是正确的。我该如何修复它?
最佳答案
我假设您没有阻止 anchor 标记的默认行为。如果您在页面http://example.com/index.html并且有一个带有 hash + 文本作为 href 的 anchor ,然后该链接会将用户带到带有 id 文本的元素。
<a href='#end'>Click Me!</a>
...
<div id='end'>content</div>
如果你想阻止浏览器出现这种标准行为,那么你需要使用该事件的 PreventDefault 函数。关键是将事件传递给回调函数:
jQuery("#show_advanced").click(function(event) {
event.preventDefault();
...
}
回调声明中缺少事件参数!
关于JavaScript 链接在 Chrome 中有效,但在 Firefox 中无效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16927419/