首页
站长论坛BBS
救助
投稿
discuz视频教程
discuz技术支持
版块
登录
快速注册

jquery中checkbox反复没反应问题解决办法

冷蝶 2015-4-19 [jQuery] 来自PC 复制链接
53234
discuz使用视频教程
31idc

马上注册,一起探讨正确快速的建站方法

您需要 登录 才可以下载或查看,没有帐号?快速注册

x
checkbox由于特殊性所以我们要选中与反选都与其它的有一点区别,下文整理了一个jquery中checkbox反复没反应问题解决办法,大家一起来看看。

jquery1.9以后,checkbox的选中用attr就有问题,第一次能选中,第二次选不中,要换成prop来设置属性。

1、jquery中checkbox反复没反应问题重现
  1. <html>
  2. <body>
  3.     <input type="checkbox" name="items" value="test" id='test' />test
  4.     <button class='selected'>选中</button>
  5.     <button class='unselected'>不选中</button>
  6. </body>
  7. <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
  8. <script type="text/javascript">
  9. $(function(){
  10.     $('.selected').click(function(){
  11.         $('#test').attr('checked','checked');
  12.     });
  13.     $('.unselected').click(function(){
  14.         $('#test').removeAttr('checked');
  15.     });
  16. });
  17. </script>
  18. </html>
复制代码

在这里有一点要注意,第一次选中后,用开发者工具,可以看到,checkbox有checked='checked'属性,第二次,点了,但是选不中,还是有checked='checked'

2、jquery中checkbox反复没反应问题解决办法
  1. <script type="text/javascript">
  2. $(function(){
  3.     $('.selected').click(function(){
  4.         $('#test').prop('checked',true);
  5.     });
  6.     $('.unselected').click(function(){
  7.         $('#test').prop('checked',false);
  8.     });
  9. });
  10. </script>
复制代码



上一篇:jquery在html,text,val的区别对比
下一篇:js/jquery快速获得图片真实的宽度和高度
洛阳app开发 发表于 2015-4-21 14:12:15 来自PC
支持学习
洛阳app代写 发表于 2015-4-21 14:30:21 来自PC
支持学习
洛阳app代写 发表于 2015-4-21 14:30:27 来自PC
支持学习
洛阳app技术 发表于 2015-4-22 11:19:59 来自PC
支持学习
lvguiqun 发表于 2015-4-22 13:37:37 来自PC
都可以来学习交流
您需要登录后才可以回帖 登录 | 快速注册

本版积分规则

快速回复 返回顶部 返回列表