JQuery操作select checkbox radio总结

JQuery是一个很强大的工具所以我要找到它最便捷的方法,嘻嘻

Select 增删改查:

Select查:

1.val值:

$("#selectid").val();       //最方便的

2.text值:

$("#selectid option:selected").text();       //最方便的

或 $("#selectid").find("option:selected").text()

3.Index值:

$("#selectid").get(0).selectedIndex;              //最方便的

Select改:

1.val值:

$("#selectid").val("xxx");               //最方便的

或 $("#selectid").attr("value","xxx");

2.text值:

$("#selectid option[text=abc]").attr("selected",true);              //最方便的

或 $("selectid option:contains(xxx)").attr("selected",true);

3.index值:

$("#select option[index=1]").attr("selected",true);                  //最方便的

Select增:

$("#selectid").append($("<opiton value=‘0‘>张三</option>"));         //这两个都挺常用

$("#selectid").prepend($("<opiton value=‘0‘>张三</option>"));

Select删:

清空:$("#selectid").empty();     //一般的插入前都会清空

部分删:

$("#selectid option:gt(0)").remove();    //因为第一行有时候是tHead 的情况清空

$("#selectid option[value=xxx]").remove();

$("#selectid option[text=xxx]").remove();

$("#selectid option[index=xxx]").remove();

select选中 不选中

$("#selectid").attr("selected",true);

$("#selectid").attr("selected",false);

Radio查:

$("#radioid").val();

$("#radioid[name=xxx]").val();

$("#radioid[id=xxx]").val();

Radio改:

$("radioid[value=xxx]").attr("checked",true);

$("radioid:eq(1)").attr("checked",true);

Radio删:

$("radioid").remove();

Checkbox查:

$("#checkboxid").val();

$("#checkboxid[name=xxx]").val();

$("#checkboxid[id=xxx]").val();

Checkbox改:

$("checkboxid[value=xxx]").attr("checked",true);

$("checkboxid:eq(1)").attr("checked",true);

$(":button").bind("click",function(){

$(":checkbox").each(function(){

//$(this).attr("checked",!$(this).attr("checked"));       点击按钮checkbox反选;

//$(this).attr("checked",true);       点击按钮checkbox全选;

$(this).attr("checked",false);       点击按钮checkbox全不选;

//if($(this).attr("checked")==true){alert($(this).val())}         选中的值

//if($(this).attr("checked")==false){alert($(this).val())}        没选中的值

})

})

})

Checkbox删:

$("checkboxid").remove();

txt文本框查:

$("#txtid").val();

txt文本框改:

$("#txtid").val("xx");

txt文本框删:

$("#txtid").val("");

jquery radio取值,checkbox取值,select取值,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();//清空下拉框

JQuery操作select checkbox radio总结

时间: 2024-10-24 01:04:05

JQuery操作select checkbox radio总结的相关文章

jquery 操作select,checkbox,radio (整理)

在工作中经常用到select,checkbox,radio,今天有点空闲就整理一下,免得以后用的时候还要重新找. 操作select下拉框 -- 获取值或选中项: 1, $("#select_id").change(function(){//code...});  //为Select添加事件,当选择其中一项时触发 2,var checkValue=$("#select_id").val(); //获取Select选择的Value 3,var checkText=$(&

jQuery设置 select、radio、checkbox 默认选中的值

[javascript] view plain copy <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m

javascript获取select,checkbox,radio的值

转发来自  博客园博主:肖品 博主的链接 1.获取和设置select,checkbox,radio的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"&

Jquery操作select,左右移动,双击移动 取到所有option的值

$(function () { function MoveItem(fromId, toId) { $("#" + fromId + " option:selected").each(function () { $(this).appendTo($("#" + toId + ":not(:has(option[value=" + $(this).val() + "]))")); }); $("#&

js与jQuery操作select大全

Js操作Select是很常见的,也是比较实用的,每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 一.js操作select部分 判断select选项中 是否存在Value="paraValue"的Item 向select选项中 加入一个Item 从select选项中 删除一个Item 删除select中选中的项 修改select选项中 value="paraValue"的text为"paraText" 设置s

jQuery操作&lt;input type=&quot;radio&quot;&gt;

jQuery操作<input type="radio"> <input type="radio">如下: 1 2 3 4 5 <input type="radio" name="city" value="BeiJing">北京 <input type="radio" name="city" value="TianJi

JQuery操作select中的option

html页面代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&q

JS/JQuery操作select下拉框

一.js 操作select 下拉框 var selObj = 下拉框对象 1. 移除所有项:selObj.options.length = 0; 2. 移除下拉框中的一项:selObj.options.remove(index); “index”为下拉框选项的索引值,若0索引项移出(自上而下),那么1索引项的索引会变为0,后面的索引依次向前推进 也可利用循环,移除所有项: var length = selObj.options.length; for(var i=length-1;i>=0;i-

Jquery操作select、checkbox、radio详细讲解

一 .Select jQuery获取Select选择的Text和Value: 1. $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 2. var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text 3. var checkValue=$("#s