全选复选框不起作用答案

【问题标题】：Select all checkbox not working全选复选框不起作用
【发布时间】：2013-04-10 10:07:33
【问题描述】：

我一直在使用引导表通过 kendo 数据源从数据库中获取数据。因此，为了使其更具交互性，我使用了一个复选框来同时执行操作。

我想用一个复选框删除所有条目。我已阅读有关使用 jQuery 删除带有单个复选框的条目的信息。但问题是我在表格中只有一个复选框，并且所有条目都是使用 kendo 数据源获取的。

如果我在制造混乱，请看这里-

<script id="template" type="text/x-kendo-template">
  <tr>
      <td> 
          <input type="checkbox" class="done" data-id="#= CID #" ></input>

      </td></tr>
</script>

<table>
<tr>
 <th style="width:10%;">
                        <input type="checkbox" />
                    </th>
</tr>
</table>

现在使用剑道数据源我只有一列复选框。

所以我正在这样做-

<script type="text/javascript">
        $('.done').click(function (event) {
            if (this.checked) {
                // Iterate each checkbox
                $(':checkbox').each(function () {
                    this.checked = true;
                });
            }
        });

    </script>

仍然没有结果。救命！

【问题讨论】：

您的 html 代码似乎有问题！脚本标签中还有一个额外的单个代码和html代码。

标签： javascript jquery checkbox

【解决方案1】：

尝试将您的 jQuery 代码包装在 $(document).ready(function(){}); 或 $(function(){}); 中，让它看到整个 DOM：

$(document).ready(function() {
    $('.done').click(function (event) {
        if (this.checked) {
            // Iterate each checkbox
            $(':checkbox').each(function () {
                this.checked = true;
            });
        }
    });
});

此外，您的 HTML 包含在 script 标记内，将其移到外部并删除多余的 ' 以及 input 标记不需要关闭 </input> 标记：

<tr>
    <td> 
        <input type="checkbox" class="done" data-id="#= CID #" />
    </td>
</tr>

【讨论】：

【解决方案2】：

<script type="text/javascript">
 $(document).ready(function(){   
     $('.done').click(function (event) {
        if ($(this).attr('checked')) {
            $('input:checkbox:not(".done")').each(function () {
                $(this).attr('checked', 'checked');
            });
          }
      });
});
</script>

试试这个。它可能有效

【讨论】：

【解决方案3】：

试试这个：

$(function () {    
    $('.done').on('click', function(){
              // i comment this condition if you want selectall for checked or unchecked
              //if ($(this).is(':checked')){
                        $(':checkbox').prop('checked', this.checked);
              //}
    });
});

【讨论】：

您的代码看起来不错，但这对我不起作用，因为我只有一个框，并且使用数据源它会创建一个复选框列表。
@Manoz 我认为你需要在你的剑道脚本之后执行这个 jQuery 函数。

【解决方案4】：

试试这个：

脚本

$(document).ready(function(){   
   $('.done').click(function (event) {
      $('.chkbxq').each(function () {
        $(this).attr('checked', flag);
      });
   });
});

HTML：

<table>
  <tr>
    <th style="width:10%;">
       <input type="checkbox" class="chkbxq" />
    </th>
  </tr>
</table>

【讨论】：