我有一个包含一些问题和答案的页面，默认情况下答案是折叠的。当他们单击问题时，我展开隐藏的答案 div。问题是当我点击这些问题时，窗口会跳到屏幕顶部。这不是一个大问题，但我觉得很烦人，因为我必须再次向下滚动到问题。
链接看起来像这样：
<a href="#" id="myID">Myquestion</a>
我使用 jQuery 和.click作为事件侦听器。
有什么简单的方法可以避免这种情况，还是我必须使用.scroll并找到问题的坐标？我宁愿避免这种情况。
编辑：我知道我可以使用锚点来做到这一点，但我想完全避免屏幕的任何跳跃。
您需要添加preventDefault()到您的点击处理程序。这将停止浏览器执行它自己的链接处理程序，并且只会运行您指定的代码。
例子：
$("#myID").click(function(e) {
e.preventDefault();
// Do your stuff
});
不要将 A 标签用于与导航无关的任务。它不是语义标记，也不会优雅地降级。改用按钮。
您可以非常简单地做到：只需!在您的末尾添加href：
<a href="#!" id="myID">Myquestion</a>
替代的 jQuery 方式是：
$("#myID").click(function(e) {
e.preventDefault(); // one way
return false; // second way prevent default click action from happening
});
$("#myID").click(function(e) {
if(e.preventDefault)
e.preventDefault();
else
e.stop();
});
e.preventDefault()单独在旧版本的 IE 中不起作用。
实际上，最简单的方法是从锚标记中删除 href 属性。从 HTML5 开始，锚标记不需要包含 href 属性来表示语义。
所以
<a id="myID">Myquestion</a>
代替
<a href="#" id="myID">Myquestion</a>
这适用于 IE8+、Chrome 和 Firefox。请注意， :link css 样式不适用于不包含 href 属性的锚标记。
如果您需要 href 属性和/或 IE7 兼容性，则
$("#myID").click(function(e) {
if(e.preventDefault)
e.preventDefault();
else
e.stop();
});
可能是最好的方法。