这里主要说一下这个jquery中的data()方法,个人感觉这个方法平时挺少用到的,所以说一说,按照官方的解释就是 向元素附加数据,然后取回该数据;
嗯,是的,就是这么简单。
那这里说一下这个方法的使用,我们都知道单选按钮在点击之后再点击是不能直接取消的,要取消的话只能使用js设置checked属性,如果是单个单选按钮,还是挺容易的,但是多个单选的时候,就会觉得很蛋疼,所以我们可以使用data()方法来实现

html部分

<div><input type="radio">按钮</div>
<div><input type="radio">按钮</div>
<div><input type="radio">按钮</div>
<div><input type="radio">按钮</div>
<div><input type="radio">按钮</div>

js部分

$('input:radio').click(function(){
            var $radio = $(this);
            if ($radio.data('checked')){
              $radio.prop('checked', false);
              $radio.data('checked', false);
            } else {
              $radio.prop('checked', true);
              $radio.data('checked', true);
            }
});

input radio点击选中再点击取消的更多相关文章

  1. jquery对类的操作,添加,删除,点击添加,再点击删除

    jquery对类的操作,添加(addClass),删除l类(remoceClass),点击添加,再点击删除(toggleClass)

  2. 点击div全选中再点击取消全选div里面的文字

    想做一个就是点击一个div然后实现的功能是div里面的文字都成选中状态,然后就可以利用浏览器的自带的复制功能,任意复制在哪里去了 在网上百度了一下 然后网上的答案感觉很大的范围 然后一些搜索 然后就锁 ...

  3. [转]Cordova Android 返回键拦截(backbutton)和退出(再点击一次跳出)

    本文转自:https://blog.csdn.net/aierJun/article/details/53944061 在Android原生webview里重写onBackPressed()就可以.@ ...

  4. 用vue2.0实现点击选中active,其他选项互斥的效果

    在正常的js中.我们如果要实现点击选中active然后其他取消的效果,我们可以定义一个类,当点击的时候给给多有的dom取消active的类,给当前元素加上这个类名,说的很啰嗦,直接来看代码说话吧(表示 ...

  5. EasyUI Datagrid 数据网格 点击选中行 再次单击取消选中行

    适用于jquery-easyui-1.9.15版本: 在项目中全局搜索: opts.singleSelect==true 或者在jquery.easyui.min.js中搜索: opts.single ...

  6. radio点击一下选中,再点击恢复未选状态

    radio点击一下选中,再点击恢复未选状态 实现方式1: <input   type="radio"   id="cat"   name="ca ...

  7. js input radio点击事件

    html代码: <input type="radio" name="myname" value="1" />1 <inpu ...

  8. jQuery实现radio第一次点击选中第二次点击取消功能(转)

    转载自:http://www.jb51.net/article/113730.htm 由于项目的需求,要求radio点击两次后为取消状态,不方便修改为checkbox,可以用正面的方法实现. // j ...

  9. 在用easyui中做CRUD功能时,当删除一行或多行数据后再点击修改会提示你选中了多行,如何解决这个bug了?

    在用easyui中做CRUD功能时,当删除一行或多行数据后再点击修改会提示你选中了多行,如何解决这个bug了? 在删除成功后,加上这句话就可以了:$("#dg").datagrid ...

随机推荐

  1. node代理遇到的坑记

    在进行前端mock地址代理时候,进行了webpack的node反向代理: 实际mock地址是:http://10.118.183.10/mock/hb/startwork/openredpacket ...

  2. Redis03——Redis是如何删除你的数据的

    众所周知Redis针对每一个key都能单独设置过期时间,那么Redis是怎么处理这些key的过期时间的呢?当同一时间有大量Key同时到期时,Redis又是怎么处理的呢?会不会影响到我的线上业务呢?如果 ...

  3. BrowserSync(保存代码后,自动刷新浏览器)

    摘要 Browsersync能让浏览器实时.快速响应您的文件更改(html.js.css.sass.less等)并自动刷新页面.更重要的是 Browsersync可以同时在PC.平板.手机等设备下进项 ...

  4. (转)GNU风格ARM汇编语法指南(非常详细)3

    原文地址:http://zqwt.012.blog.163.com/blog/static/120446842010111482023804/ 3.GNU汇编程序中的分段 <1>    . ...

  5. isEmpty 判空函数 内部分别判断是 null 空数组 等

    import { oneOf, isEmpty } from '@/libs/tools' export const isEmpty = (value) => { if (value == nu ...

  6. 【MyBatis笔记】mapper文件的配置以及说明

    <!doctype html>[MyBatis笔记]mapper文件的配置以及说明 figure:last-child { margin-bottom: 0.5rem; } #write ...

  7. json到底是什么??????

    JSON(JavaScript Object Notation)是一种基于JavaScript语法子集的开放标准数据交换格式.JSON是基于文本的,轻量级的,通常被认为易于读/写. 通俗解释: 1.j ...

  8. Swift中的感叹号( ! )与问号( ? )之谜

    基本了解 在Swift代码会经常看到定义属性或方法参数时类型后面会紧跟一个感叹号( ! )或问号( ? ), 刚开始接触Swift的童鞋就可能不太明白之代表什么意思,一头雾水,开始凌乱了. 本文将带你 ...

  9. Java容器的常见问题

    记录Java容器中的常见概念和原理 参考: https://github.com/wangzhiwubigdata/God-Of-BigData#三Java并发容器 https://blog.csdn ...

  10. IntegerCache缓存占用堆、栈、常量池的问题,自动拆装箱的基本概念,Integer==int时的问题说明

    原创声明:作者:Arnold.zhao 博客园地址:https://www.cnblogs.com/zh94 先普及一个基本概念:Java中基本数据类型的装箱和拆箱操作 自动装箱 在JDK5以后,我们 ...