"全部检查”;不选中复选框

"check all" not checking checkboxes

本文关键字：复选框 检查 quot 全部      更新时间：2023-09-26

我在尝试检查所有函数时使用了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>

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

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

记住在脚本之前实际包含jQuery

FIDDLE

如果我理解正确，这就是处理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>
相关文章：