Question

我正在使用我在JS小提琴上找到的脚本：http://jsfiddle.net/Q4PUw/2/

当我点击切换链接时，它会切换框并显示它，但是，它会跳回到页面顶部，然后我必须再次向下滚动才能查看已切换的内容。

如何保持页面内容以便用户不必再次向下滚动才能查看内容？

这是我的代码：

<style type="text/css">p.content-one {display:none;}</style>
<script type="text/javascript">//<![CDATA[ 
$(window).load(function(){
$('.expand-one').click(function(){
    $('.content-one').slideToggle('slow');
});
});//]]>  
</script>
<div class="sitesection">
<p class="expand-one"><a href="#">Toggle Test Here</a></p>
<p class="content-one">
The content goes here
</p>
</div>

Answer 1

remove href="#" in <a> tag

或

If you dont want, remove a tag because you are using expand-one class in p tag

Answer 2

尝试使用event.preventDefault()，如下所示： -

$('.expand-one').click(function(event){
    event.preventDefault();
    $('.content-one').slideToggle('slow');
});

jquery toggle ...跳转到页面顶部

2 个答案: