这里主要说一下这个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. 如何使用Logstash

    目录 一.什么是Logstash 二.如何安装 三.快速使用 四.Input输入插件 五.codec编码插件 六.filter过滤器插件 七.output输出插件 八.总结 一.什么是Logstash ...

  2. Codeforces Round #378 (Div. 2)F

    题目:一个带权连通无向图,给第i条边权值减1需要花费ci元,你一共有S元,求最小生成树. 容易得出钱全部花在一条边上是最优的. 我们先做一遍最小生成树. 然后我们枚举减哪一条边. 如果这条边是树上的, ...

  3. oracle去除重复数据与oracle分页

    一.去除oracle中重复数据,可以使用rowid列,rowid列是一个伪列,该列在数据库中灭一个表中都有,但是我们查询数据库的时候,默认都没有给我们返回这一列,这一列用来区分数据库中的每一行时间,可 ...

  4. 你不一定知道的UrlPrefix路由规则

    引言 接上文,容器内web程序一般会绑定到http://0.0.0.0:{某监听端口}或http://+:{某监听端口},以确保使用容器IP可以访问到web应用. 正如我们在ASP.NET Core官 ...

  5. Blazor-断开连接后重新加载浏览器

    在大多数情况下,Blazor将与以前相同的线路上重新连接到服务器.但有时无法重新连接,需要重新加载web浏览器才能使网站重新工作.如果服务器回收应用程序池,则需要手动重新加载页面在没有调试的情况下在I ...

  6. 解决tinyint映射成boolean/byte的问题

    前言 最近受疫情的影响,公司要做一个类似一码通的系统为客户服务.由我来进行表的设计.创建表之后需要逆向生成Java的entity.mapper.mapper.xml.由于我在数据库中定义了大量 tin ...

  7. layui radio 单选框 效果 显示不来 解决方法

    $("input[name=sex][value=女]").attr("checked", data.data.adminInfoEntity.adminInf ...

  8. Idea中使用http请求解决中文乱码问题

    以请求百度为例,使用如下代码即可解决: GET https://www.baidu.com User-Agent: Mozilla/.X MetaSr 1.0

  9. Android ListView显示访问WebServices返回的JSON结果

    1.WebServices的返回结果 2.ListView内容布局代码 <?xml version="1.0" encoding="utf-8"?> ...

  10. laravel的中间件创建思路

    网上有很多解析laravel中间件的实现原理,但是不知道有没有读者在读的时候不明白,作者是怎么想到要用array_reduce函数的? 本文从自己的角度出发,模拟了如果我是作者,我是怎么实现这个中间件 ...