我是靠谱客的博主 年轻水蜜桃,最近开发中收集的这篇文章主要介绍jQuery实现点击单选按钮切换选中状态效果,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

实现效果:第一次点击单选按钮时选中该按钮,再次点击时取消选中该单选按钮。

 

关键就是要将单选按钮原来的值保存起来,第二次点击时。如果原来选中则取消,否则选中。

 

看代码吧,是用jQuery实现的,功能虽小。知识点不少啊。。。。。

 

 

Js代码   收藏代码
  1. $(document).ready(function(){  
  2.     var old = null; //用来保存原来的对象  
  3.     $("input[name='sex']").each(function(){//循环绑定事件  
  4.         if(this.checked){  
  5.             old = this; //如果当前对象选中,保存该对象  
  6.         }  
  7.         this.onclick = function(){  
  8.             if(this == old){//如果点击的对象原来是选中的,取消选中  
  9.                 this.checked = false;  
  10.                 old = null;  
  11.             } else{  
  12.                 old = this;  
  13.             }  
  14.         }  
  15.     });  
  16. });  

 

 

最后

以上就是年轻水蜜桃为你收集整理的jQuery实现点击单选按钮切换选中状态效果的全部内容,希望文章能够帮你解决jQuery实现点击单选按钮切换选中状态效果所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(57)

评论列表共有 0 条评论

立即
投稿
返回
顶部