使用 jQuery 实现 radio 的选中与反选
使用 jQuery 实现 radio 的选中与反选
我们知道在 Html 中当我们选中一个radio后，再次点击该 radio，那么该 radio 依然是一个选中的状态，但是有时我们需要实现这样的逻辑：一个选中的 radio，再次点击该 radio 时，会取消它的选中状态 。
演示效果
实现逻辑
- 取消 click 事件的默认动作
- 使用 mouseup 控制 radio 的选中与反选
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script type="text/javascript">
$(function(){
$(":radio[name='sex']").click(function(event){
// 禁用事件的默认动作
event.preventDefault();
})
// 绑定一个鼠标单击事件
.mouseup(function(){
$(this).prop("checked",!$(this).is(":checked"));
});
})
</script>
</head>
<body>
男：<input type="radio" name="sex" value="1"> 女：<input type="radio" name="sex" value="0">
</body>
</html>此文参考至：https://www.cnblogs.com/zz-930474270/p/7091147.html
使用 jQuery 实现 radio 的选中与反选的更多相关文章
- JQuery判断radio是否选中，获取选中值
本文摘自:http://www.cnblogs.com/xcj1989/archive/2011/06/29/JQUERY_RADIO.html /*----------------------- ...
- JQuery判断radio是否选中并获取选中值的示例代码
这篇文章主要介绍了JQuery判断radio是否选中并获取选中值的方法,代码很简单,但很实用,需要的朋友可以参考下 其他对radio操作功能,以后在添加.直接上代码,别忘记引用JQuery包 ? 1 ...
- jquery checkbox radio 标签 选中的3种方法
张映 发表于 2013-07-16 分类目录: js/jquery 标签:checkbox, jquery, radio, 选中 jquery 很灵活,checkbox radio标签选中的方法有很多 ...
- Jquery 获取 radio/select选中值
Radio <input type="radio" name="rd" id="rd1" checked="checked& ...
- springMvc接收ajax数组参数，以及jquery复选框选中、反选、全选、全不选
一.复选框选中.反选.全选.全不选 html代码: <input type='checkbox' name='menuCheckBox' value='10' >苹果 <input ...
- JQuery - 判断radio是否选中，获取选中值
代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. ...
- jquery 获取radio被选中的值
<html> <head> <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"& ...
- jquery中checkbox的选中，反选，全不选 注意1.6版本以上将attr改成prop
<script type="text/javascript"> $(function () { // 全选 $("#btnCheckAll").bi ...
- jquery判断radio是否选中
微交易-实体系统 微交易-虚拟系统 <div class="system"> <div class="systemt"> <l ...
随机推荐
- [Linux] 024 IP 地址配置和网络 yum 源
1. IP 地址配置 (1) 使用 setup 工具 $ setup ps setup 是 RedHat 系列的功能:一般地,Debian系列没有这个功能 Xubuntu 没有这个功能 (2) 启动网 ...
- 使用requests_html抓取数据
from requests_html import HTMLSession import json class YejiCollege: def __init__(self, url): self.u ...
- Python入门习题9.数码管时间
#七段数码管.py import turtle,datetime def drawGap(): #绘制数码管间隔 turtle.penup() turtle.fd(5) def drawLine(dr ...
- Springboot War包部署下nacos无法注册问题
目录 1. @EnableDiscoveryClient的使用 2. EnableDiscoveryClientImportSelector类的作用 3.AutoServiceRegistration ...
- python学习第九天数据类型列表创建，查找操作方法
数据类型中列表是整个python最常用的数据类型,列表最常用的方法就是创建,增删改查,切片,循环以及排序等系列操作,任何操作都离不开增删改查操作,这样很容记住操作方法 1,列表的创建 list=[] ...
- 如何写一个简单的基于 Qt 框架的 HttpServer ？
httpserver.h #ifndef HTTPSERVER_H #define HTTPSERVER_H #include <QObject> #include <QtCore& ...
- git-vi
VI命令可以说是Unix/Linux世界里最常用的编辑文件的命令了,但是它的命令集太多,所以要想精通他,也是一件很不容易的事情,除了专业SA,对于我们开发人员而已只需要掌握一些最最常见的用法应该就可以 ...
- MS DOS 常用命令整理
最近在开发用到一些dos下的一些指令,还有bat文件,特别是bat的便捷性让我在生活和开发过程中好好使用. dos指令: java com.pdcss.util.JacobService > D ...
- CSS-02 BFC的理解
两个概念 感觉BFC挺重要的,于是最近查阅网上资料后小结一下,如果有不对的地方还望指正. 先理解两个概念: BOX :盒子模型 Block-Leave Box :块级元素 display属性为bloc ...
- ASE Alpha Sprint - backend scrum 6
本次scrum于2019.11.11在sky garden进行,持续30分钟. 参与人: Zhikai Chen, Jia Ning, Hao Wang 请假: Xin Kang, Lihao Ran ...