1

这就是我想要的:我有多个<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">标签时警报显示为空白吗?

4

2 回答 2

2

您正在使用链接类而不是 $link 来呼应您的 LI。

另外,使用

if ($(this).hasClass("forms"))
于 2013-02-25T18:06:37.367 回答
0

.prop()应该只在访问 DOM 元素的属性而不是属性(如classor stylewidth等)时使用。如果您想要该类,请.attr('class')改用(或者,正如其他人所提到的,您可以使用.hasClass()(使用 jQuery)测试元素是否应用了特定类)。

跟进.propvs .class

<a href="#foo" class="foo-class" id="foolink">Foo Bar link</a>

var a = document.getElementById('foolink'),
    $a = $(a);

$a.prop('href') // like directly calling a.href
$a.prop('id')  // again, like directly calling a.id
$a.attr('class') // where as it's actually a.className
于 2013-02-25T18:08:26.703 回答