jquery实用应用之jquery操作radio、checkbox、select

本文收集一些jquery的实用技巧,非常实用的哦,其中对radio、checkbox、select选中与取值的方法。

获取一组radio被选中项的值
var item = $(‘input[@name=items][@checked]‘).val();
获取select被选中项的文本
var item = $("select[@name=items] option[@selected]").text();
select下拉框的第二个元素为当前选中值
$(‘#select_id‘)[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$(‘input[@name=items]‘).get(1).checked = true;

获取值:

文本框,文本区域:$("#txt").attr("value");
多选框checkbox:$("#checkbox_id").attr("value");
单选组radio: $("input[@type=radio][@checked]").val();
下拉框select: $(‘#sel‘).val();

控制表单元素:
文本框,文本区域:$("#txt").attr("value",‘‘);//清空内容
$("#txt").attr("value",‘11‘);//填充内容

多选框checkbox: $("#chk1").attr("checked",‘‘);//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr(‘checked‘)==undefined) //判断是否已经打勾

单选组radio: $("input[@type=radio]").attr("checked",‘2‘);//设置value=2的项目为当前选中项
下拉框select: $("#sel").attr("value",‘-sel3‘);//设置value=-sel3的项目为当前选中项
$("<option value=‘1‘>1111</option><option value=‘2‘>2222</option>").appendTo("#sel")//添加下拉框的option
$("#sel").empty();//清空下拉框

//控制表单元素:
//文本框,文本区域:
$("#text_id").attr("value",‘‘);//清空内容
$("#text_id").attr("value",‘test‘);//填充内容
//多选框checkbox:
$("#chk_id").attr("checked",‘‘);//未选中的值
$("#chk_id").attr("checked",true);//选中的值
if($("#chk_id").attr(‘checked‘)==undefined) //判断是否已经选中
//单选组radio:
$("input[@type=radio]").attr("checked",‘10‘);//设置value=10的单选按钮为当前选中项
//下拉框select:
$("#select_id").attr("value",‘test‘);//设置value=test的项目为当前选中项
$("<option value=‘test‘>test</option><option value=‘test2‘>test2</option>").appendTo("#select_id")//添加下拉框的option
$("#select_id").empty();//清空下拉框

原文地址:https://www.cnblogs.com/wangxiaoy/p/10812809.html

时间: 2024-10-10 07:16:35

jquery实用应用之jquery操作radio、checkbox、select的相关文章

JSP的3种方式实现radio ,checkBox,select的默认选择值

JSP的3种方式实现radio ,checkBox,select的默认选择值.以radiao 为例:第一种方式:在jsp中使用java 脚本,这个方法最直接,不过脚本太多,不容易维护<%String state = request.getParrameter("state" )%> <td width="27"><input type="radio" name="state" value=&quo

jquery操作radio,checkbox

1. 获取radio选中的value. $('input:radio[name=sex]:checked').val(); 2. 选择 radio 按钮 (Male). $('input:radio[name=sex]:nth(0)').attr('checked',true);或者$('input:radio[name=sex]')[0].checked = true; 3. 选择 radio 按钮 (Female). $('input:radio[name=sex]:nth(1)').att

jQuery 操作 radio、select、checkbox

<script type="text/javascript"> $(function () { 一.radio 1.获取选中值,三种方法都可以: $('input:radio:checked').val(): $("input[type='radio']:checked").val(); $("input[name='rd']:checked").val(); 2.设置第一个radio为选中值: $('input:radio:firs

Radio Checkbox Select 操作

一个小总结 <!DOCTYPE html> <html> <head> <meta name="description" content="[radio and checkbox]"> <meta charset="utf-8"> <title>JS Bin</title> <script src="https://code.jquery.com/

v-model 结合 radio checkbox select的使用

*v-model其实是一个语法糖,它的背后本质上是包含两个指令操作: 1.v-bind绑定一个value属性2.v-on指令给当前元素绑定input事件* v-model结合单选框使用 <label for="male"> <input type="radio" name="sex" id="male" value="男" v-model="sex" />男 &l

JS操作Radio与Select

//radio的chang事件,以及获取选中的radio的值 $("input[name=radioName]").on("change", function() { var val= this.value; }); //初始化下拉框组件 function initSelect(id, data) { var arr = []; for (var i = 0, len = data.length; i < len; i++) { var item = data

Jquery常用操作:checkbox、select取值,radio、checkbox、select选中及其相关

常用Jquery操作:checkbox取值.select取值.radio选中.checkbox选中.select选中及其相关: 1.影藏页面元素 使用jquery真的很方便,比如要控制div的显示与隐藏,一句话就搞定了,请看下面使用说明. $("#id").show()表示display:block, $("#id").hide()表示display:none; $("#id").toggle()切换元素的可见状态.如果元素是可见的,切换为隐藏的

Jquery 操作Html 控件 CheckBox、Radio、Select 控件

在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio.select,用 Jquery 库操作其他会方便很多,下面用Jq对这些控件的操作进行一个全面的代码总结. 一.Jquery 对 CheckBox 的操作: <input id="ckb1" name="ckb" checked="checked" value="0" type="checkbox&q

jQuery操作radio、checkbox、select总结

本文转自:http://tiame.iteye.com/blog/1493261 1.radio:单选框 HTML代码: Html代码   <input type="radio" name="radio" id="radio1" value="1" />1 <input type="radio" name="radio" id="radio2" va