当用户点击复选框时,我正在使用Jquery的切换事件做一些事情,如下所示:
$('input#myId').toggle( function(){ //do stuff }, function(){ //do other stuff } );
问题是当我点击复选框时没有勾选复选框.(我在切换事件中添加的所有内容都正常工作.)
我尝试过以下方法:
$('input#myId').attr('checked', 'checked');
和
$(this).attr('checked', 'checked');
甚至简单
return true;
但没有任何工作.谁能告诉我哪里出错了?
编辑 - 感谢所有回复的人.除了检查属性的部分外,Dreas的回答几乎对我有用.这很完美(虽然它有点hacky)
$('input#myInput').change(function () { if(!$(this).hasClass("checked")) { //do stuff if the checkbox isn't checked $(this).addClass("checked"); return; } //do stuff if the checkbox isn't checked $(this).removeClass('checked'); });
再次感谢所有回复的人.
使用change
事件而不是toggle
事件,如下所示:
$('input#myId').change(function () { if ($(this).attr("checked")) { //do the stuff that you would do when 'checked' return; } //Here do the stuff you want to do when 'unchecked' });
虽然使用change
Dreas Grech建议的事件处理程序是合适的,但它在IE 6和7中不能很好地工作,它change
在焦点模糊之前不会触发事件(也就是说,直到你在复选框的区域外单击) .正如QuirksMode所说,"这是一个严重的错误".
您可能希望使用click
事件处理程序,但这不适用于键盘导航.你也需要注册一个keyup
处理程序......
另请参阅此相关问题.
我还没有找到一个好的跨浏览器解决方案,它支持鼠标点击和键盘激活复选框(并且不会触发太多事件).
关于检查是否选中复选框的解决方案checked
,您可以使用HTML的checked
属性,而不是添加自己的类:
$('input#myInput').change(function () { if ($(this).attr("checked")) { //do stuff if the checkbox is checked } else { //do stuff if the checkbox isn't checked } });
如果选中该复选框,则任何浏览器都会将元素的checked
属性设置为input
值,"checked"
如果未选中该复选框,则将其设置为null
(或删除属性).
为什么不使用$ .is()?
$('input#myId').change( function() { if ($(this).is(':checked')) { // do stuff here } else { // do other stuff here } });