,,jquery操作select常见方法大全【7种情况】

,,jquery操作select常见方法大全【7种情况】

本文主要介绍了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的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。

相关文章阅读

  • 使用jquery实现图片轮播效果如何,jQuery图片轮播
  • 使用jquery实现图片轮播效果如何,jQuery图片轮播,使用jQuery实现图片轮播效果
  • 举例说明jquery中each函数的使用,jquery each()
  • 举例说明jquery中each函数的使用,jquery each(),JQuery中each()的使用方法说明
  • 一篇文章带你了解jquery动画人物,一篇文章带你了解jquery动画制作
  • 一篇文章带你了解jquery动画人物,jquery的动画,一篇文章带你了解jQuery动画
  • trigger的用法总结,jquery trigger 传参数
  • trigger的用法总结,jquery trigger 传参数,jQuery中值得注意的trigger方法浅析
  • js hover 触发事件显示另一元素,js hover 触发事件,jQuery中多个元素的Hover事件解决方案
  • js apply 实现原理,jquery apply用法_1
  • js apply 实现原理,jquery apply用法
  • js apply 实现原理,jquery apply用法,js中apply方法的使用详细解析
  • js apply 实现原理,jquery apply用法,JS中apply()的应用实例分析
  • jq获取radio选中的值,jquery radio 取值
  • jq获取radio选中的值,jquery radio 取值,Jquery获取radio选中值实例总结
  • 留言与评论(共有 条评论)
       
    验证码: