我是一个绝对的新手，所以请多多包涵。我读了很多 我认为可能与我的问题有关的帖子，但我很难理解所提供的解决方案。
我正在尝试仅使用 CSS 创建一个点击水平手风琴。使用 Firefox 它工作得很好。问题出现在 Chrome 和 Safari 中。
问题是每次点击链接时页面都会向下滚动到页面底部，您需要向上滚动才能看到全部内容。链接如下所示：
<h2><a href="#accordion1">title1</a></h2>
不用说，这对用户来说可能非常烦人。我在某处读过这可以
避免使用 JavaScript preventDefault()。我该怎么做？还有什么其他方法可以防止这种情况发生？
【问题讨论】：
标签： css
编辑 - 所以 preventDefault() 似乎取消了所有默认行为（实际上是有道理的） - 我提出的第一个解决方案根本不是解决方案。
所以，事实证明这很难做到。
经过一番搜索，我得出的结论是，如果不取消链接默认行为（因此.preventDefault() 中的默认行为），就无法取消滚动。
您可以做的是在链接滚动完成后滚动回原来的位置，但即使您尽快执行此操作，您仍然可以在浏览器上看到滚动发生 - 所以这是一个丑陋的解决方案。 （无论如何你都可以在这里看到 - http://jsfiddle.net/joplomacedo/RpDyc/）。
那么，替代方案？因为当你这样做时（我假设你在这里使用 :target 伪类）你仍然需要 javascript，然后忘记 :target 的东西并单独依赖 javascript。它更简单、更干净且不那么“hacky”。
这是我的做法 (jquery) -> http://jsfiddle.net/joplomacedo/AfzJY/
但是，如果您坚持使用 CSS 进行操作，那么我建议您按照 Chris Coyier 的建议 here 进行操作，不要利用 :target 而是 :checked。我不会在这里进一步发展，因为他的文章做得很好。
编辑前
你在使用 jquery 吗？如果是这样，您只需要这样：
$('a[href="#accordion1"]').on('click', function (e) {
e.preventDefault();
});
如果您不使用 jquery，那么这里是使用纯 javascript 的方法：
var cancels_links = document.getElementsByClassName('cancels-link');
var cancel = function cancel(e) {
e.preventDefault();
};
for (var i = 0, max = cancels_links.length; i < max; i++) {
cancels_links[i].addEventListener('click', cancel, false );
}
...这个要求您将class="cancels-link" 添加到您要取消的默认行为的每个“a”元素。
这里有两个解决方案 -> http://jsfiddle.net/cBQnv/3/
【讨论】：