Question

我正在处理分页，它们每页10行，分页的第一列带有复选框，意思是每行在第一列中都有复选框，bheckbox id名称是id =＆＃34;复选框＆＃34;

如果选中了一个或多个复选框，我想使用名为＆＃34; checkbox-tools＆＃34;

的css从上到下滑动其中一条消息

我在jquery代码中编写的不是我所期望的，我的代码所做的是如果点击复选框然后会向上滑动，如果再次选中复选框将向上滑动不是我想要的。

我喜欢的是，如果选中任何复选框，则滑动框，如果未选中任何复选框，则选中或取消选中，然后向上滑动或不显示。我怎么能这样做！

这是代码..

的CSS ..

 .checkbox-tools
    {
        background-color: #CCC;
        height: 400px;
        width: 1000px;
        border: 1px solid #333;
        position: absolute;
        z-index: 100;
        bottom: 100px;
        padding: 0;
        margin: 0;
        left: 100px;
        display:none;
    }

jquery ...

$(":checkbox").change(function(){
    $(".checkbox-tools").slideToggle("slow");


  });  });

php ....

<div class="checkbox-tools">
  <div id="cancel"><a class="button" href="#"><span class="print-icon">cancel</span></a></div> 
  <div id="pagecontent">
message from checkbox..
  </div>

Answer 1

因为你关心国家，所以不要切换。切换可以让你陷入混乱的境地。相反，在更改复选框时，查看是否有任何已检查并执行slideDown，否则执行slideUp

$(':checkbox').change(function() {
    // use the :checked selector to find any that are checked
    if ($(':checked').length) {
        $('.checkbox-tools').slideDown('slow');
    } else {
        $('.checkbox-tools').slideUp('slow');
    }
 });

如果选中复选框，则滑动

1 个答案: