这就是我想要的:我有多个<h3>
标签被用作链接来显示常见问题解答的答案。我还添加了一个表单,以防用户在该页面上没有看到任何感兴趣的问题。表单的链接位于页面底部。现在,当用户单击显示表单链接时,我希望窗口向下滚动到底部。我已经这样做了,但是当我单击任何链接时,窗口也会滚动到底部。我希望用户仅单击窗口滚动的显示表单链接。
这是我到目前为止所拥有的:
<body>
<?php
$array = array("link 1","link 2","link 3");
foreach($array as $link)
{
echo "<h3 class='link'>".$link."</h3>";
echo "<div>";
//information to be displayed
echo "</div>";
}
?>
<h3 class="forms">Show Form</h3>
//form information here
</body>
这是 javscript:
<script>
$(document).ready(function(){
$('h3').click('bind',function() {
$(this).toggleClass('open').next().slideToggle(500,function(){
var i = $(this).prop('class');
if(i == 'forms')
{
$("html, body").animate({scrollTop: $(document).height()}, "slow");
}
});
});
});
</script>
我添加了一个警报来验证我的输出,当我单击<h3 class="forms">
警报时是空白的,但是当我单击其他警报时,警报显示“链接”。有人可以帮我弄清楚为什么单击<h3 class="forms">
标签时警报显示为空白吗?