本文主要介绍了jquery操作选择的常用方法,并结合实例总结分析了jQuery操作选择的七种常见情况及相关操作技巧。有需要的可以参考一下。
本文阐述了jquery操作选择的常用方法。分享给你,供你参考,如下:
选择之前HTML页面设计中的下拉框,或者multiple='multiple '时,显示为列表。经常在页面上进行操作,这些操作无非是:
1.获取所选选择的选项或文本的值。
2.删除选中的选项。
3.添加新选项进行选择。
4.获取选择选项的长度,即数字大小
5.空选择。
6.在两个选择框之间互相添加和删除,从左到右,从右到左,通常是多选的情况。
7.确定选择框中是否有某个值的选项。
对于第一种情况,使用以下方法:
$('#select_id ')。change(function(){//代码.});//为Select添加一个事件,当选择其中一个时触发
var checkText=$('#select_id ')。查找('选项:已选择')。text();//获取通过Select选择的文本
var checkValue=$('#select_id ')。val();//获取Select选择的值
var checkIndex=$('#select_id ')。获取(0)。selectedIndex//获取Select选择的索引值
var max index=$(' # select _ id option:last ')。attr(' index ');//获取Select的最大索引值。jQuery设置由Select选择的文本和值:
$('#select_id ')。获取(0)。selectedIndex=1;//选择选择索引值为1的项目。
$('#select_id ')。val(4);//选择Select值为4的项目。
$(' # select _ id option[text=' jQuery ']')。attr('selected ',true);//将Select的文本值设置为jQuery选择的项目。
在第二种情况下,删除的处理:
$('#select_id option:last ')。移除();//删除Select中索引值最大的选项(最后一个)
$('#select_id option[index='0']')。移除();//删除Select中索引值为0的选项(第一个)
$('#select_id option[value='3']')。移除();//删除Select中值为“3”的选项
$('#select_id option[text='4']')。移除();//删除Select中Text='4 '的选项
如果要删除选中的选项,需要获取选中选项的序列号。var检查索引=$ ('# select _ id ')。获取(0)。selectedindex然后调用上面的方法删除。
对于第三种情况,添加选项:
$('#select_id ')。append(' option Value=' Value ' text/option));//追加一个选项(下拉项)以供选择
$ ('# select _ id ')。prepend ('option value=' 0 '请选择/option));//为Select插入一个选项(第一个位置)
对于第四种情况,获取select的长度。
var total count=$(' # single _ user _ choice ')。get(0). options . length;
在第五种情况下,清除选择。
$('#single_user_choice ')。get(0). options . length=0;
第六种情况。两个选择框之间的增删,从左到右,从右到左,一般是多选的情况,也就是设置了multiple='multiple '。
var $ options=$(' # select 1 option:selected ');//获取当前选中的项目
var $ remove=$ options . remove();//删除下拉列表中选中的项目
$ remove . appendto(' # select 2 ');//追加到对方
在第七种情况下,确定select中是否有某个值的选项。
函数is_Exists(selectid,value){
var theid=' # ' selectid
var count=$(theid)。get(0). options . length;
var isExist=false
for(var I=0;icounti ){
if ($(theid)。获取(0)。选项[i]。value==value){
isExist=true
打破;
}
}
返回isExist
}
更多对jQuery感兴趣的读者,请参考我们的专题:《jQuery常见事件用法与技巧总结》、《jQuery常用插件及用法总结》、《jQuery操作json数据技巧汇总》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》和《jquery选择器用法总结》。
希望这篇文章对jQuery编程的大家有所帮助。
郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。