请帮忙看下jquery代码错误

tenhilltree 2015-06-02 03:54:14
我下面的jquery代码哪里有问题,为什么只有全不选按钮能正常使用,全选和反选都不行

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
<script type="text/javascript" src="jquery-2.1.4.js"></script>
<script>
$(function(){
$('#btnq').click(function(){
$(':checkbox').attr('checked',true);
});

$('#btnqb').click(function(){
$(':checkbox').attr('checked',false);
});

$('#btnf').click(function(){
$(':checkbox[checked=true]').attr('checked',false);
$(':checkbox[checked=false]').attr('checked',true);
});
});

</script>
</head>
<body>

<input type="checkbox" name="chk" id="ck1" />1
<input type="checkbox" name="chk" id="ck2" />2
<input type="checkbox" name="chk" id="ck3" />3
<input type="checkbox" name="chk" id="ck4" />4
<input type="checkbox" name="chk" id="ck5" />5

<input type="button" value="全选" id="btnq" />
<input type="button" value="全不选" id="btnqb" />
<input type="button" value="反选" id="btnf" />
</body>
</html>
...全文
188 15 打赏 收藏 转发到动态 举报
写回复
15 条回复
切换为时间正序
请发表友善的回复…
发表回复
npk191954 2015-06-02
  • 打赏
  • 举报
回复
attr()和prop()的使用场合,右边一栏是官方推荐使用的:
npk191954 2015-06-02
  • 打赏
  • 举报
回复
input checkbox类型在jQuery中不允许你这样写,而是必须用prop。 “对于值是true/false的property,类似于input的checked attribute等,attribute取得值是HTML文档字面量值,property是取得计算结果,property改变不影响attribute字面量,但attribute改变会影响property计算”。 你在第一个响应函数里加一个alert测试,然后点击复选框打勾和点击复选框取消打勾,两种情况下分别点击”全选按钮“,”checked“字面量会是一样的: $(function(){ $('#btnq').click(function(){ $('#ck1').attr("checked",true); alert($('#ck1').attr("checked")); });
天际的海浪 2015-06-02
  • 打赏
  • 举报
回复
引用 12 楼 tenhilltree 的回复:
[quote=引用 11 楼 jslang 的回复:] 1.6版本之后 attr()改为prop()
好的,谢谢!请问$(':checkbox[checked=true]')选择器这样写有问题吗,我选了两个复选框,然后用调试器调试,结果数组长度是0.[/quote] $(':checkbox:checked')
tenhilltree 2015-06-02
  • 打赏
  • 举报
回复
引用 11 楼 jslang 的回复:
1.6版本之后 attr()改为prop()
好的,谢谢!请问$(':checkbox[checked=true]')选择器这样写有问题吗,我选了两个复选框,然后用调试器调试,结果数组长度是0.
天际的海浪 2015-06-02
  • 打赏
  • 举报
回复
1.6版本之后 attr()改为prop()
soton_dolphin 2015-06-02
  • 打赏
  • 举报
回复
用prop 代替attr

$(function(){
		$('#btnq').click(function(){
			$(':checkbox').prop('checked',true);

		});

		$('#btnqb').click(function(){
			$(':checkbox').prop('checked',false);
		});

		$('#btnf').click(function(){
			$(':checkbox[checked=true]').prop('checked',false);
			$(':checkbox[checked=false]').prop('checked',true);
		});
	});

Braska 2015-06-02
  • 打赏
  • 举报
回复
引用 8 楼 tenhilltree 的回复:
其他的都没问题啊 我用的jquery1.8版本
tenhilltree 2015-06-02
  • 打赏
  • 举报
回复
引用 7 楼 Ragin 的回复:
对,是这样,谢谢! 全选按钮的问题是什么呢,点第一次的时候有效果,然后再点就没效果
Braska 2015-06-02
  • 打赏
  • 举报
回复
引用 5 楼 tenhilltree 的回复:
我IE 谷歌测了下 全不选没问题 反选出问题是 $(':checkbox[checked=true]').attr('checked',false) ; //执行完以后 所有选中变成未选中 $(':checkbox[checked=false]').attr('checked',true); //所有上面执行的未选中和之前的未选中的变成选中 所以不管做什么操作的结果都是全选
tenhilltree 2015-06-02
  • 打赏
  • 举报
回复
我的jquery库文件也是从官网下载的,应该没问题啊
tenhilltree 2015-06-02
  • 打赏
  • 举报
回复
引用 1 楼 Ragin 的回复:
$('#btnf').click(function(){
	$(':checkbox').each(function(){
		$(this).attr('checked', !$(this).attr('checked'));
	});
});
这种方法我知道,帮忙看下我写的那种哪里有错误,而且只有”全部选”按钮正常有效果,其它两个按钮都不正常。在火狐和google都试了
tony4geek 2015-06-02
  • 打赏
  • 举报
回复
反选 $(':checkbox').each(function(index, element) { $(this).attr("checked", !$(this).attr("checked")); });
风中的少年 2015-06-02
  • 打赏
  • 举报
回复

  <script>
$(function(){
	$('#btnq').click(function(){
		$(':checkbox').attr('checked','checked');
	});

	$('#btnqb').click(function(){
		$(':checkbox').removeAttr('checked');
	});

	$('#btnf').click(function(){
		//alert($(':checkbox[checked=true]').attr('checked'))
		//$(':checkbox[checked=true]').attr('checked',false);
		//$(':checkbox[checked=false]').attr('checked',true);
		$(':checkbox').each(function(index, element) {
            if($(this).attr('checked')=="checked"){
				$(this).removeAttr('checked');
			}else{
				$(this).attr('checked','checked');
			}
        });
		
		
	});
});

  </script>
BillHu233 2015-06-02
  • 打赏
  • 举报
回复
.checkbox 意思是class 是这个得全部选中 你可以给input加个class=“aaa” 这样就可以$(".aaa")获取全部的input对象了 ,然后在循环挨个attr(“Checked”,“checked”)
Braska 2015-06-02
  • 打赏
  • 举报
回复
$('#btnf').click(function(){
	$(':checkbox').each(function(){
		$(this).attr('checked', !$(this).attr('checked'));
	});
});
相关推荐

87,715

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告