javascript - Javascript onClick show div : Unexpected behavior. 浏览器窗口垂直向上滚动

Question

我有以下 js，它在单击时显示一个 div( map )。当 div 显示时，即使我位于页面底部，浏览器窗口也会垂直向上滚动。如何防止这种行为？

HTML

<a href="#" class="toggle-next-div">Map</a>
<div class="slidingDiv">
<strong>content</strong>
<a href="#" class="toggle-next-div">hide</a>
</div>

JS

$(document).ready(function(){
$(".slidingDiv").hide();
$('.toggle-next-div').click(function(){
    $(this).next().slideToggle();
});
});

Answer 1

您可以使用.preventDefault()或return false:

$('.toggle-next-div').click(function(e){
    $(this).next().slideToggle();
    e.preventDefault();
});

// OR //

$('.toggle-next-div').click(function(){
    $(this).next().slideToggle();
    return false;
});

请注意，如果您有依赖于事件传播的函数，您可能需要采用第一个解决方案。 return false; 也停止事件传播。