Question

我有两个函数，我在无序列表上运行，第一个是在第六个之后包装所有li元素的div，并且显示none，以便我可以使用slidedown和slideup函数来显示和隐藏它们，slidedown和slideup在页面上的其他元素上完美无缺，而不是在li元素上。

这是jQuery im用于两个函数

<script type="text/javascript">
    jQuery(function() {                 
        jQuery('.clients-list li:gt(5)').wrapAll('<div style="display: none;" class="clientscontainer">');
    });
</script>


<script type="text/javascript">
jQuery(function(){
    jQuery('#clientsexpand').click(function(){
        if(jQuery('.clientscontainer').is(':hidden')) {
            jQuery('.clientscontainer').slideDown('slow');
            return false;
        } else {
            jQuery('.clientscontainer').slideUp('slow');
            return false;
        }
    });
});
</script>

使用此代码，隐藏的li会在点击后显示，但它不会滑动，它似乎暂停几秒钟，然后只是显示它们，然后当我再次单击隐藏它们时，空白块显示正确在页面下面然后隐藏。

如果有人知道如何解决这个问题，那就太棒了。

干杯，

Answer 1

jQuery('#clientsexpand').click(function(){
        if(jQuery('.clientscontainer').is(':hidden')) {
            jQuery('.clientscontainer').slideDown('slow');
            return false;
        } else {
            jQuery('.clientscontainer').slideUp('slow');
            return false;
        }
    });

更改为：

$('#clientsexpand').click(function(){
    $('.clientscontainer').slideToggle('slow');
});

Slidetoggle为您处理if语句等。

jQuery没有做我告诉它做的事和slideDown

1 个答案: