我试图使用图像作为复选框。以下可以正常工作,如果它是无线电,而不是我正在定位的复选框,但复选框问题是,我无法选择一个元素,再次点击它选择它。
// 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
,这应该是更可靠和有效的。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。