Javascript Jquery'；道具'；使chrome对大量复选框无响应

我有一个web应用程序，其中有一个asp.net的复选框列表，其中包含1000多个复选框。我的页面上有6个这种类型的复选框列表。我在每个复选框列表的顶部放置了两个按钮“全部选中”和“全部取消选中”，一次单击即可全部选中和取消选中。

这是我的代码

 $('#btnCheckAllName').click(function() {
             $('[id$=cblName] :checkbox').prop('checked', true);
        });

我正在使用jquery-1.9.1.js。 这段代码在mozilla 33.1中运行得很好，但当我在chrome 41.0中运行这段代码以选中列表中的所有复选框时，它会挂起，过了一段时间，一条消息说要终止页面。

但当我使用每个循环来选中下面的所有复选框时。

   $('#btnCheckAllName').click(function (e) {
            $("#HeadContent1_cblName > tbody > tr").each(function () {
                $($(this).find("input[id^=HeadContent1_cblName_]")).prop('checked', true);
            });
        });

它工作正常。另外，如果我在chrome中启动调试器并编写alert（），它会在2-3分钟后出现，这意味着chrome处于挂起状态。有人能告诉我为什么第一个在fire fox中工作而不是在chrome中工作吗

这里是html

    <table id="HeadContent1_cblName">
        <tbody>

            <tr>
                <td>
                    <input id="HeadContent1_cblName_0" type="checkbox" value="asdf" name="ctl00$HeadContent1$cblName$0">
                    <label for="HeadContent1_cblName_0">asdf</label>
                </td>
            </tr>


            <tr>
                <td>
                    <input id="HeadContent1_cblName_1" type="checkbox" value="asdf" name="ctl00$HeadContent1$cblName$1">
                    <label for="HeadContent1_cblName_1">asdf</label>
                </td>
            </tr>

        </tbody>

    </table>

asdf
asdf

我觉得问题不在于

.prop（）

，而在于您的DOM选择

您的第一个选择器使用非标准选择器，因此它是用JavaScript实现的。此外，您正在将

[id$=cblName]

和

:checkbox

应用于找到的每个元素，而不仅仅是

输入

元素

因此，第一个改进是：

//  v--or whatever   v--only inputs
$('div[id$=cblName] input:checkbox').prop('checked', true);

---

但要使用完全本机选择器，请使用

[type=checkbox]

而不是

：checkbox

：

//  v--or whatever   v--only inputs
$('div[id$=cblName] input[type=checkbox]').prop('checked', true);
// ---------------------------^-- native selector for only checkboxes

这也应该会起到推动作用

---

注意：

您没有提供HTML标记，但是从第二个代码块猜测，

cblName

元素是

：复选框。这意味着第一个选择器是错误的。应该是这样的：

$('input[id$=cblName]:checkbox').prop('checked', true);

或者更好：

$('input[id$=cblName][type=checkbox]').prop('checked', true);

请注意，我删除了
：复选框前面的空格。按照您的方式，您正在查找
输入的后代，这毫无意义。
@user3517064:是的，您的第一个选择器不正确。因为你在那里放了一个空格，它是“后代组合符”，你基本上是说要寻找
cblName
元素后代的复选框，这是没有意义的，因为
cblName
是一个输入。你试过我答案中的最后一行代码了吗？有帮助吗。。。。但好消息是您的代码工作得非常完美：）。。还记得我的老师以前教我jquery的话，他说要使用正确的选择器快速访问dom的特定元素，您的代码为此进行了优化。@user3517064：如果您只需要这些
tr
元素中的输入，那么我会坚持使用第二个版本，或者类似的版本。但是您不需要在选择周围添加额外的
$（）
。只需执行
$（this）.find（“输入[id^=HeadContent1\u cblName\”）.prop（…