jQuery重置单选框和input框
本文提供了三种取消选中radio的方式,代码示例如下:
本文依赖于jQuery,其中第一种,第二种方式是使用jQuery实现的,第三种方式是基于JS和DOM实现的。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
<!DOCTYPE HTML> <html> <head> <title>单选按钮取消选中的三种方式</title> </script> <script type= "text/javascript" > $( function (){ // var $browsers = $( "input[name=browser]" ); var $cancel = $( "#cancel" ); var $byhide = $( "#byhide" ); var $remove = $( "#remove" ); // $cancel.click( function (e){ // 移除属性,两种方式都可 //$browsers.removeAttr("checked"); $browsers.attr( "checked" , false ); }); // $byhide.click( function (e){ // 切换到一个隐藏域,两种方式均可 //$("#hidebrowser").attr("checked",true); $( "#hidebrowser" ).attr( "checked" , "checked" ); }); // $remove.click( function (e){ // 直接去的DOM元素,移除属性 // 如果不使用jQuery,则可以移植此方式 var checkedbrowser=document.getElementsByName( "browser" ); /* $.each(checkedbrowser, function(i,v){ v.checked = false; v.removeAttribute("checked"); }); */ // var len = checkedbrowser.length; var i = 0; for (; i < len; i++){ // 必须先赋值为false,再移除属性 checkedbrowser[i].checked = false ; // 不移除属性也可以 //checkedbrowser[i].removeAttribute("checked"); } }); }); </script> </head> <body> <p>您喜欢哪款浏览器?</p> <form> <input style= "display:none;" id= "hidebrowser" type= "radio" name= "browser" value= "" > <input type= "radio" name= "browser" value= "Internet Explorer" >Internet Explorer<br /> <input type= "radio" name= "browser" value= "Firefox" >Firefox<br /> <input type= "radio" name= "browser" value= "Netscape" >Netscape<br /> <input type= "radio" name= "browser" value= "Opera" >Opera<br /> <br /> <input type= "button" id= "cancel" value= "取消选中方式1" size= "20" > <input type= "button" id= "byhide" value= "取消选中方式2" size= "20" > <input type= "button" id= "remove" value= "取消选中方式3" size= "20" > </form> </body> </html |
取消
$('.reset-bottom').click(function(){
$('.mui-input-clear').attr('value','');
$('input[name=sex]').removeAttr("checked");
$('input[name=type]').removeAttr("checked");
$('input[name=steelyard]').removeAttr("checked");
$('input[name=brand]').removeAttr("checked");
});
jQuery重置单选框和input框的更多相关文章
- jquery对单选和下拉框的操作
jquery 对表单的操作: 对单选框的操作: 一.对单选框的操作: 1.$('input
- 用jquery修改默认的单选框radio或者复选框checkbox选择框样式
默认的radio和checkbox选框很难看.我去看了一下qq注册的页面.发现单选和复选框并没有用<input>,居然是用是A标签.然后用css背景图片展示选择框,用JavaScript控 ...
- Jquery判断单选框是否选中和获取选中的值
第一种:利用选中值判断选中 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...
- jQuery获取单选框(复选框)选中的状态
jQuery 获取单选框(复选框)选中的状态 <input type="checkbox" name="" id="choose"/& ...
- jQuery实现限制input框 textarea文本框输入字符数量的方法
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- js/jquery 获取本地文件的文件路劲 获取input框中type=‘file’ 中的文件路径(转载)
原文:http://blog.csdn.net/niyingxunzong/article/details/16989947 js/jquery 获取本地文件的文件路劲 获取input框中type= ...
- 让单选input框,不在被选中,添加disabled即可。输入框input的一些技巧
1.让单选input框,不在被选中,添加disabled即可 2.input的file文件对象的清空,只需要input.val("");就可以了.
- jQuery实现input框输入值动态搜索
我们在平时的前端开发中,经常会遇到添加数据,如果在添加之前要指定某个用户或对象进行关联,那在实现上要比普通的添加要繁琐一点.我本来的想法是给一个iframe,在 里面显示所有的数据并提供一个筛选的功能 ...
- input框中的value值到底是什么
value 属性为 input 元素设定值. 对于不同的输入类型,value 属性的用法也不同: type="button", "reset", "s ...
随机推荐
- ipfs02笔记
IPFS-day02 其他常用操作 添加文件并用文件夹包裹 ipfs add xxx -w 把內容快取到本地,并提供给他人.官网文档 ipfs pin add QmT7TX5vGmFz86V8cDkP ...
- redis的认识
<?php /* Redis优势: 性能极高 – Redis能读的速度是110000次/s,写的速度是81000次/s . 丰富的数据类型 – Redis支持二进制案例的 String, Lis ...
- 树莓派搭建 Hexo 博客(二)
Hexo 一个开源的博客框架,本文记录了一下在树莓派上搭建 Hexo 博客的过程. 上一篇介绍了 Hexo 的配置,现在网站已经能在本地访问了,也能通过 hexo generate 命令生成静态界面 ...
- MongoDB复制二:复制集的管理
1.修改oplog的大小 需要在每个机器上都配置.先在secondary上操作,最后在primary上操作. 1)以单机的方式重启复制集的实例 db.shutdownServer() 在新的端口中启 ...
- 最小生成树(MST)
原创 今天来说说最小生成树问题,我们知道最小生成树有两种求法,一种是prim算法,另一种是kruskal算法,关于两种算法的定义以及证明,请查看相关资料,这里不多说,理解起来也相当容易,我们来看一个问 ...
- linux文件系统(ext2)
一个磁盘可以划分成多个分区,每个分区必须先用格式化工具(例如某种mkfs命令)格式化成某种格式的文件系统,然后才能存储文件,格式化的过程会在磁盘上写一些管理存储布局的信息.下图是一个磁盘分区格式化成e ...
- 【bzoj2384】[Ceoi2011]Match 特殊匹配条件的KMP+树状数组
题目描述 给出两个长度分别为n.m的序列A.B,求出B的所有长度为n的连续子序列(子串),满足:序列中第i小的数在序列的Ai位置. 输入 第一行包含两个整数n, m (2≤n≤m≤1000000). ...
- BZOJ4563 HAOI2016放棋子(高精度)
没看清题还以为是要求数最大匹配数量……注意到任意障碍不在同一行同一列,且恰好有n个障碍,不妨通过交换列使得第i行第i列均有障碍.那么就是个错排了.居然wa了一发简直没救. #include<io ...
- BZOJ3456 城市规划 【多项式求逆】
题目链接 BZOJ3456 题解 之前我们用分治\(ntt\)在\(O(nlog^2n)\)的复杂度下做了这题,今天我们使用多项式求逆 设\(f_n\)表示\(n\)个点带标号无向连通图数 设\(g_ ...
- React context基本用法
React的context就是一个全局变量,可以从根组件跨级别在React的组件中传递.React context的API有两个版本,React16.x之前的是老版本的context,之后的是新版本的 ...