如何在jQuery中切换属性

@H_404_0@

我试图使用图像作为复选框。以下可以正常工作，如果它是无线电，而不是我正在定位的复选框，但复选框问题是，我无法选择一个元素，再次点击它选择它。

// image checkBox
$('#imageCheckBoxes img').click(function() {
    $(this).parent('span').find('input:checkBox').attr('checked','checked');
});

<div id="imageCheckBoxes">
    <ul>
        <li><a href="">Africa</a>  <span><img src="images/checkBox-inactive.png" /><input type="checkBox" name="" value="" /></span>
        </li>
        <li><a href="">Asia/Pacific Islands</a>  <span><img src="images/checkBox-inactive.png" /><input type="checkBox" name="" value="" /></span>
        </li>
        <li><a href="">Australia</a>  <span><img src="images/checkBox-inactive.png" /><input type="checkBox" name="" value="" /></span>
        </li>
        <li><a href="">Central/South America</a>  <span><img src="images/checkBox-inactive.png" /><input type="checkBox" name="" value="" /></span>
        </li>
        <li><a href="">Europe/Russia</a>  <span><img src="images/checkBox-inactive.png" /><input type="checkBox" name="" value="" /></span>
        </li>
        <li><a href="">North America</a>  <span><img src="images/checkBox-inactive.png" /><input type="checkBox" name="" value="" /></span>
        </li>
        <li><a href="">United Kingdom</a>  <span><img src="images/checkBox-inactive.png" /><input type="checkBox" name="" value="" /></span>
        </li>
    </ul>
</div>

我需要基本上切换检查attr()部分。

怎么做？

解决方法

我会通过传递一个函数来支持(因为jQuery 1.6，以前的attr)。返回值被设置为新的属性值。

$(this)
    .closest('li')
        .find('input:checkBox').prop('checked',function(idx,oldProp) {
            return !oldProp;
        });

这里的关键事实是，您可以通过true或false将prop设置为checked属性。 oldProp是属性的现有值(将为true或false)，所以！oldProp是反转：已检查的元素未选中，反之亦然。

请注意，我也改变了你的代码寻找最接近的祖先li元素与closest，这应该是更可靠和有效的。

如何在jQuery中切换属性

解决方法

猜你在找的jQuery相关文章