单击一个div以选中/取消选中一个复选框

我单击时应用以下代码使表行检查/取消选中子复选框。 现在我发现当点击行内的复选框本身时，它会进行检查。 可能是它检查点击（标准function），然后jquery选择点击事件并取消选中它？ 我怎样才能解决这个问题？

//check on div click $("tr").live("click",function() { var checkbox = $(this).find("input[type='checkbox']"); if( checkbox.attr("checked") == "" ){ checkbox.attr("checked","true"); } else { checkbox.attr("checked",""); } }); 

Answer 1

我怀疑click事件是从复选框冒泡到tr。 尝试添加此代码：

 $('tr input[type=checkbox]').click(function(e){ e.stopPropagation(); }); 

编辑

这是一个例子： http ： //jsfiddle.net/GSqNv/

Answer 2

检查调用者的目标不是一个复选框

 $("tr").live("click",function(event) { var target = $(event.target); if (target.is('input:checkbox')) return; var checkbox = $(this).find("input[type='checkbox']"); if( checkbox.attr("checked") == "" ){ checkbox.attr("checked","true"); } else { checkbox.attr("checked",""); } }); 

演示 http://jsfiddle.net/7Bze7/

上面的代码检查事件的发件人不是复选框。

Answer 3

除了给定的解决方案，将复选框设置为oposite状态不是更好吗？ 例如：

 var _current_state = checkbox.attr("checked"); checkbox.attr("checked") = !_current_state; 

Answer 4

关于什么：

 return false; 

因为它与输入两者相同：

 e.preventDefault(); e.stopPropagation(); 

我相信这是去 – 不是吗？