jq操作select集合

jq操作select集合

时间:2012年12月07日分类:Javascript

最近一段时间发现,老是要跟select,option相关的东西打交道,而且有的时候还会搞错,于是,抽了一点时间整理了一份使用jq库来操作select的一些事件及方法,供大家参考。

html代码:

?
1
2
3
4
5
6
7
8
9
<</code>select id="selectTest" name="selectTest">
<</code>option value="请选择">请选择</</code>option>
<</code>option value="1">11</</code>option>
<</code>option value="2">22</</code>option>
<</code>option value="3">33</</code>option>
<</code>option value="4">44</</code>option>
<</code>option value="5">55</</code>option>
<</code>option value="6">66</</code>option>
</</code>select>

获取Select:

获取select选中的text
$('#selectTest').find('option:selected').text();
获取select选中的val
$('#selectTest').find('option:selected').val();
获取select选中的索引
$('#selectTest').get(0).selectedIndex

设置Select:

设置select选中的text
var text = "66";
var count = $("#selectTest option").length;
for(var i = 0; i < count; i++){
if($("#selectTest").get(0).options[i].text == text){
$("#selectTest").get(0).options[i].selected = true;
break;
}
}
设置select选中的value
$("#selectTest").find('option:selected').attr("value","Normal");
$("#selectTest").find('option:selected').val("Normal");
$("#selectTest").get(0).options[0].value = "Normal";
设置select选中的索引
$("#selectTest").get(0).selectedIndex = index;//index为索引值
设置select option项
$("#selectTest").append("< option value='Value'>Text< /option>"); //添加一项option
$("#selectTest").prepend("< option value='0'>请选择< /option>"); //在前面插入一项option
$("#selectTest option:last").remove(); //删除索引值最大的Option
$("#selectTest option[index=0]").remove();//删除索引值为0的Option
$("#selectTest option[value='3']").remove(); //删除值为3的Option
清空 Select
$("#selectTest").empty();
$("#selectTest").children().remove();
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值