Javascript jquery选择器问题

我正在使用以下代码：

$('fieldset input[type=checkbox]').each(function () {if($(this).attr('checked','checked')){
    var switches = $(this).parent().find('.switch');
    $(switches).attr('state','on')
    $(switches).css({'left':"52px"});
    $(switches).parent().css({'background-position': "147px -37px"});
}})

但不知何故，它将我所有的复选框都设置为

checked=“checked”

我是愚蠢还是代码中有其他东西干扰了我

谢谢你的帮助：）

编辑： 这是HTML

<fieldset>
        <input checked="checked" />
        <label></label>
        <div class="toggle_box">
            <div class="switch" state="on"></div>
        </div>
    </fieldset>
    <fieldset>
        <input/>
        <label></label>
        <div class="toggle_box">
            <div class="switch"></div>
        </div>
    </fieldset>

---

这段代码正在执行

$(this).attr('checked','checked')

…返回集合以便级联工作。

对象在JavaScript中总是真实的

试试看

this.checked

…返回是否选中复选框。如果您想使用jQuery方式，请使用
$（this）.is（':checked'）
。但我不这么认为，它更冗长，性能更低。
这段代码正在执行它

$(this).attr('checked','checked')

…返回集合以便级联工作。
对象在JavaScript中总是真实的

试试看

this.checked

…返回是否选中复选框。如果您想使用jQuery方式，请使用
$（this）.is（':checked'）
。但是我不这么认为，它更冗长，性能更低。
您将
选中的
值作为第二个参数传递给
attr（）
。这导致它被设置。然后返回的是带有
输入的jQuery对象，该输入始终是真实值

您的if条件应如下所示（改用
：checked
伪类）：

另一方面，您的内部代码可以重构为：

$(this).parent().find('.switch')
    .attr('state', 'on')
    .css({ 'left': "52px" })
    .parent()
        .css({ 'background-position': "147px -37px" });

如果必须使用缓存变量（即
开关
），则可以，但不要将其包装在jQuery函数中。它本身是一个jQuery对象，因此不需要包装。
您将
选中的
值作为第二个参数传递给
attr（）
。这导致它被设置。然后返回的是带有
输入的jQuery对象，该输入始终是真实值

您的if条件应如下所示（改用
：checked
伪类）：

另一方面，您的内部代码可以重构为：

$(this).parent().find('.switch')
    .attr('state', 'on')
    .css({ 'left': "52px" })
    .parent()
        .css({ 'background-position': "147px -37px" });

如果必须使用缓存变量（即
开关
），则可以，但不要将其包装在jQuery函数中。它本身是一个jQuery对象，因此不需要包装。
如果（$（this）.attr（'checked'，'checked'））
将是您的问题。您将
checked
分配给每个复选框，而不是检查它是否已选中。
如果（$（this）.attr（'checked'，'checked'））
将是您的问题。您正在为每个复选框指定
checked
，而不是检查它是否已选中。
乍一看，我看到您使用的是
。is（'checked'）
当我认为您需要
时。（'：checked'）
前面的冒号就是区别所在

更新：我看到你更新了代码。线路

if ($(this).attr('checked', 'checked'))

实际上是将所有“输入：复选框”元素设置为选中。应该是：

if ($(this).is(':checked'))

乍一看，我发现您使用的是
。is（'checked'）
，而我认为您需要
。is（'：checked'）
前面的冒号就是区别所在

更新：我看到你更新了代码。线路

if ($(this).attr('checked', 'checked'))

实际上是将所有“输入：复选框”元素设置为选中。应该是：

if ($(this).is(':checked'))

if语句中的语句正在将复选框设置为选中。特别是，这条语句：
$（this）.attr（'checked'，'checked'）

相反，您可以执行
if（$（this）.prop（'checked'））

请阅读更多有关该网站的信息

或者，您可以执行，
this.checked
，它将直接或使用jQuery访问DOM，
$（this.is（“：checked”）
if语句中的语句将您的复选框设置为选中。特别是，这条语句：
$（this）.attr（'checked'，'checked'）

相反，您可以执行
if（$（this）.prop（'checked'））

请阅读更多有关该网站的信息

或者，您可以执行，
this.checked
，它将直接或使用jQuery访问DOM，
$（this.is（“：checked”）
实际上有一个专门用于复选框的选择器

$('fieldset input[type=checkbox]:checked').each(function(){
    var switches = $(this).parent().find('.switch');
    $(switches).attr('state','on')
    $(switches).css({'left':'52px'});
    $(switches).parent().css({'background-position':'147px -37px'});
});

如果使用该选项，则不必自己执行任何逻辑。
实际上有一个专门用于复选框的选择器

$('fieldset input[type=checkbox]:checked').each(function(){
    var switches = $(this).parent().find('.switch');
    $(switches).attr('state','on')
    $(switches).css({'left':'52px'});
    $(switches).parent().css({'background-position':'147px -37px'});
});

如果你使用它，你就不必自己做任何逻辑。
我认为正确的术语应该是链接，而不是层叠（CSS）。@BoltClock道格拉斯·克罗克福德称之为层叠。我想两者都可以。我认为正确的术语应该是链接，而不是级联（CSS）。@BoltClock道格拉斯·克罗克福德将其称为级联。我想两者都可以。