关于table里面的checkbox选择无效的问题

废话不多说, 直接看代码

XX.html

 

                        

                            

                                
 
                                
ID
                                
题型
                                
试题文本
                                
保存日期
                                
教材版本
                            
                        
                        

                            

                                

                                
1000100
                                
选择题
                                
植物光合作用
                                
2016/12/12 20:00:26
                                
教科版
                            
                            

                                

                                
1000100
                                
选择题
                                
植物光合作用
                                
2016/12/12 20:00:26
                                
教科版
                            

XX.js

$(function(){
		$('.tableEvent tbody tr').click(function(){
			var input=$(this).find('td:first-child').children('input[type=checkbox]');
			if($(input).is(":checked")){
				$(input).attr('checked',false);
			}else{
				$(input).attr('checked',true);
			}
		})
	})

这样就会有一个问题, checkbox第一次选中,再取消,是正常的,再次选择的时候,就会出现选不上的情况, 查看实时代码发现,checkbox的checked属性其实是加上去了的,但是勾勾没有出选,也就是没有被选中,至于为什么出现这种情况,网上的说法都集中在attr的身上, 把attr换成prop, 但是我也试了,根本没卵用, 百思不得其姐...

其实: checked=''  也是表示true的 也是表示已选中的

后来查AIP, 发现prop有这样一个方法

$("input[type='checkbox']").prop("checked", function( i, val ) {
  return !val;
});

直接放到click事件里,测试一下OK了

$('.tableEvent tbody tr').click(function(){
			var input=$(this).find('td:first-child').children('input[type=checkbox]');
			$(input).prop("checked", function( i, val ) {
			  return !val;
			});
})