全选反选复选框子类同步效果

<script src="jquery-2.1.3.min.js" type="text/javascript"></script>
<?php
$arr = ['a', 'b', 'c', 'd'];
?>
<table>
   <?php
    foreach ($arr as $k => $v) {
        ?>
        <tr>
            <td>
                <input  class="module_role_ids"   type="checkbox"/>
            </td>
            <td>
                <?php echo $v; ?>
            </td>
            <td>
                <?php echo $v; ?>
            </td>
            <td>
                <input type="checkbox"  class="action_role_ids"/>
                <input type="checkbox" class="action_role_ids"/>
                <input type="checkbox" class="action_role_ids"/>
            </td>
        </tr>
    <?php } ?>
</table>

<script>
    $('.module_role_ids').each(function () {
        $('.module_role_ids').each(function () {
            var _this = $(this);
            var _parent = _this.parents('tr');
            _this.change(function () {
                _parent.find('.action_role_ids').prop('checked', _this.prop('checked'));
            });
            _parent.find('.action_role_ids').change(function () {
                _this.prop('checked', _parent.find('.action_role_ids:not(:checked)').length <= 0);
            });
        });
    });
</script>

全选、全不选代码:
<pre name="code" class="javascript">      $("#allxz").on('click', function () {
            var isChecked = $(this).prop("checked");
            $("input[name='fh']").prop("checked", isChecked);
        });

具体可参看http://www.jb51.net/article/71067.htm


阅读更多
个人分类: jquery
上一篇如何设置jquery的ajax方法为同步
下一篇ajax异步上传图片
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭