单选框radio总结

1.获取值

$("input[name='killOrder']:checked").val();

$('input:radio:checked').val()；

$("input[type='radio']:checked").val();

$(":radio[checked]").each(function(radio){alert($(this).val());

2.设置第一个Radio为选中值：

$('input:radio:first').attr('checked', 'checked');

$('input:radio:first').attr('checked', 'true');

3.设置最后一个Radio为选中值：

$('input:radio:last').attr('checked', 'checked');

$('input:radio:last').attr('checked', 'true');

4.根据索引值设置任意一个radio为选中值：

$('input:radio').eq(索引值).attr('checked', 'true');索引值=0,1,2....

$('input:radio').slice(1,2).attr('checked', 'true');

5.根据Value值设置Radio为选中值

$("input:radio[value='2']").attr('checked','true');

$("input[value='1']").attr('checked','true');

6.删除Value值为2的Radio

$("input:radio[value='2']").remove();

7.删除第几个Radio

$("input:radio").eq(索引值).remove();索引值=0,1,2....

如删除第3个Radio:$("input:radio").eq(2).remove();

8.遍历Radio

$('input:radio').each(function(index,domEle){

//写入代码

});

9.修改单选框样式

input[type="radio"] + label::before {

content: "\a0";

display: inline-block;

vertical-align: middle;

width: 15px;

height: 15px;

margin-right: 5px;

border-radius: 50%;

text-indent: .15em;

margin-bottom: 4px;

border: 1px solid #CCCCCC;

}

input[type="radio"]:checked + label::before {

background-color: #4A90E2;

background-clip: content-box;

padding: 2px;

}

input[type="radio"] {

position: absolute;

clip: rect(0, 0, 0, 0);

}

.radio-inline{

padding-left: 0;

}

input[type=radio][disabled]:checked + label::before{

background-color:#CCCCCC;

background-clip: content-box;

padding: 2px;

}

单选框radio总结相关推荐

jquery单选框radio绑定click事件实现和是否选中的方法
使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项: 1. ...
单选框radio绑定click事件
2019独角兽企业重金招聘Python工程师标准>>> <html><head><title>单选框radio绑定click事件</titl ...
前端radio单选框默认选中_「radio选中」单选框radio总结（获取值、设置默认选中值、样式） - seo实验室...
radio选中单选框 radio 是否 1.获取值 $("input[name='killOrder']:checked").val(); $('input:radio:che ...
antd radio设置默认选中_单选框radio总结（获取值、设置默认选中值、样式）
单选框 radio 是否 1.获取值 $("input[name='killOrder']:checked").val(); $('input:radio:checked').v ...
js原生、jquery单选框radio总结（获取值、设置默认选中值、样式）
单选框 radio总结: 一.页面样式截图: <div class="radio-inline"><input type="radio" na ...
html中单选按钮设置监听事件,浅谈监听单选框radio改变事件(和layui中单选按钮改变事件)，单选框radio...
浅谈监听单选框radio改变事件(和layui中单选按钮改变事件),单选框radio 若是只引用jquery的话,监听单选按钮改变事件如下: 男女 $(document).ready(functio ...
页面初始化设置单选框radio默认选中，清空默认选中
前言: 页面初始化设置单选框radio默认选中,根据公司已有的标签属性来写的,坑,刚开始一直获取不到这个圆框框,搞了半天,终于搞定了. 浏览器截图: js代码: 产品的name是由uuid生成的: $ ...
CSS3重新定义input中呆若木鸡的默认复选框CheckBox和单选框Radio样式
<!DOCTYPE html> <html> <head><meta charset="UTF-8"><style>/* ...
CSS3-实现单选框radio的小动画
在微信上看到一个教程文,觉得制作的小动画还是很有意思的,自己也试验了一下.一开始动画怎么都不执行(我用的HB),因为内置浏览器对css3的不兼容.加上各种浏览器前缀后就好了.但是旋转那个效果,在HB里 ...
Vue.js 极简小例：表单（输入框 input、文本域 textarea、单选框 radio、下拉菜单 selected、复选框 checkbox）
前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家.点击跳转到教程. 代码: <template> <div > <p>------- ...

单选框radio总结

单选框radio总结相关推荐

最新文章

热门文章