"检查所有"不检查复选框

时间:2014-10-17 08:07:03

标签: javascript jquery html

我使用JQuery而我正在尝试检查所有功能然后因为这个js没有显示所有检查字段但是我删除了那个js然后滑块受影响。所以请尝试解决我的问题我也没有使用冲突功能,但它不起作用。

      <script type="text/javascript">
        jQuery.noConflict()
        jQuery.ready(function() {
            jQuery("#selectall").click(function() {
                $('.case').attr('checked', this.checked);
            }); // prototype
        });
    </script>

<div class="accordion-heading">
    <input type="checkbox" id="selectall" name="sample" class="selectall" />
    <div style="float:left; "> <a class="accordion-toggle collapsed" data-toggle="collapse" data-parent="#accordion1" href="#collapse_1" /> Admin Module
    </div>
    </a>
</div>
<div id="collapse_1" class="accordion-body collapse in">
    <div class="accordion-inner" id="checkboxlist">
        <table class="table table-bordered table-hover" id="test" align="center" style="width:100%">
            <tr>

                <th width="450"><strong>Form Name</strong>
                </th>
                <th width="150"><strong>select</strong>
                </th>
                <th width="150"><strong>Edit</strong> </th>
                <th width="150"><strong>Delete</strong>
                </th>
                <th width="150"><strong>View</strong>
                </th>
            </tr>
            <tr>
                <td style="padding-left:20%">Authentication</td>
                <td style="padding-left:8%">
                    <input type="checkbox" id="case1" name="emailid[]" value="" class="case" /> </td>
                <td style="padding-left:8%">
                    <input type="checkbox" id="case1" name="emailid[]" value="" class="case" />
                </td>
                <td style="padding-left:8%">
                    <input type="checkbox" id="case1" name="emailid[]" value="" class="case" /> </td>
                <td style="padding-left:8%">
                    <input type="checkbox" id="case1" name="emailid[]" value="" class="case" />
                </td>
            </tr>

2 个答案:

答案 0 :(得分:3)

你做错了,只有当前文档有一个就绪处理程序,你应该使用prop设置一个属性,并在它是一个复选框时监听change事件。

jQuery(function($) {
    $("#selectall").on('change', function () {
         $('.case').prop('checked', this.checked);
    });
});

请记住在脚本

之前实际包含jQuery

FIDDLE

答案 1 :(得分:0)

如果我理解正确,这就是你应该如何处理jQuery.noConflict():

<script type="text/javascript">
jQuery.noConflict();
// Here, $ is a reference to whatever it was assign (if I understand correctly, it is prototypeJS)
(function($) {
    // Here, $ is a reference to jQuery
    $(function($) {
        $("#selectall").click(function() {
            $('.case').attr('checked', this.checked);
        }); // jQuery
    });
})(jQuery);
// Here, $ is a reference to whatever it was assign (if I understand correctly, it is prototypeJS)
</script>