您的位置:首页 > Web前端 > JQuery

JQuery随心笔记----jquery操作select

2016-03-12 10:49 549 查看
项目前台每次用的select的用法都要上网搜一番,不如此次整理一下select取值,取文本的方法,同时把radio,checkbox的取值方法一同整理下来。

1.Select

(1)获取Select选择的Value

var checkValue=$("#select_id").val();

(2)获取Select选择的Text 

var
checkText=$("#select_id").find("option:selected").text();

(3)获取Select选择的索引值

var
checkIndex=$("#select_id ").get(0).selectedIndex;

(4)获取Select最大的索引值 

var
maxIndex=$("#select_id option:last").attr("index");

(5)为Select添加事件,当选择其中一项时触发

$("#select_id").change(function(){//code...});

(6)设置Select的Value值为i的项选中 

$("#select_id
").val(i); 

(7)设置Select索引值为1的项选中

$("#select_id
").get(0).selectedIndex=1;

(8)设置Select的Text值为jQuery的项选中 

$("#select_id
option[text='jQuery']").attr("selected", true);

(9)为Select追加一个Option(下拉项)

 $("#select_id").append("<option
value='Value'>Text</option>");

(10)为Select插入一个Option(第一个位置) 

 $("#select_id").prepend("<option
value='0'>请选择</option>"); 

(11)删除Select中索引值最大Option(最后一个) 

$("#select_id
option:last").remove(); 

(12)删除Select中索引值为0的Option(第一个) 

 $("#select_id
option[index='0']").remove();

(13)删除Select中Value='i'的Option 

$("#select_id
option[value='i']").remove(); 

(14)删除Select中Text='i'的Option 

$("#select_id
option[text='i']").remove();

2.radio

(1)获
取一组radio被选中项的值 
var item = $('input[name=items][checked]').val(); 

(2)radio单选组的第二个元素为当前选中值 
$('input[name=items]').get(1).checked = true; 

3.checkbox

("#chk1").attr("checked",'');//不打勾 
$("#chk2").attr("checked",true);// 打勾 
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾 

$("#checkbox_id").attr("value");//获取值 

注:选择器里面使用:和[]的区别,使用:是这个元素自身的属性,可能不显示;(比如select被选中实际上会拥有一个属性selected,但是页面元素上不一定显示这个属性)而用[]则一定是带有元素的属性或属性和属性值(比如name属性,用[]就是[name=aa])
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: