JQuery下拉控件select的操作汇总

JQuery获取和设置Select选项方法汇总如下:

获取select

先看看下面代码:缙云县外国专家局

1 $("#select_id").change(function(){//code...});   //为Select添加事件,当选择其中一项时触发
2 var checkText=$("#select_id").find("option:selected").text();  //获取Select选择的Text
3 var checkValue=$("#select_id").val();  //获取Select选择的Value
4 var checkIndex=$("#select_id ").get(0).selectedIndex;  //获取Select选择的索引值
5 var maxIndex=$("#select_id option:last").attr("index");  //获取Select最大的索引值
6 $("#select_id ").get(0).selectedIndex=1;  //设置Select索引值为1的项选中
7 $("#select_id ").val(4);   //设置Select的Value值为4的项选中
8 $("#select_id option[text=‘jQuery‘]").attr("selected"true);   //设置Select的Text值为jQuery的项选中

获取select 选中的 text :

1 $("#ddlRegType").find("option:selected").text();

获取select选中的 value:

1 $("#nowamagic").val();

获取select选中的索引:

1 $("#nowamagic").get(0).selectedIndex;

设置select

jQuery添加/删除Select的Option项:

1 $("#select_id").append("<option value=‘Value‘>Text</option>");  //为Select追加一个Option(下拉项)
2 $("#select_id").prepend("<option value=‘0‘>请选择</option>");  //为Select插入一个Option(第一个位置)
3 $("#select_id option:last").remove();  //删除Select中索引值最大Option(最后一个)
4 $("#select_id option[index=‘0‘]").remove();  //删除Select中索引值为0的Option(第一个)
5 $("#select_id option[value=‘3‘]").remove();  //删除Select中Value=‘3‘的Option
6 $("#select_id option[text=‘4‘]").remove();  //删除Select中Text=‘4‘的Option

设置select 选中的索引:

1 //index为索引值
2 $("#nowamagic").get(0).selectedIndex=index;

设置select 选中的value:

1 $("#nowamagic").attr("value","Normal");
2 $("#nowamagic").val("Normal");
3 $("#nowamagic").get(0).value = value;

设置select 选中的text:

1 var count=$("#nowamagicoption").length;
2   for(var i=0;i<count;i++) 
3      {           if($("#nowamagic").get(0).options[i].text == text) 
4         
5             $("#nowamagic").get(0).options[i].selected = true
6            
7             break
8         
9     }

清空 select:

1 $("#nowamagic").empty();
时间: 2024-11-06 18:02:05

JQuery下拉控件select的操作汇总的相关文章

使用谷歌提供的SwipeRefreshLayout下拉控件,并自定义实现下拉加载的功能

package com.loaderman.swiperefreshdemo; import android.os.Bundle; import android.os.Handler; import android.support.v4.widget.SwipeRefreshLayout; import android.support.v7.app.AppCompatActivity; import android.view.Gravity; import android.view.View;

基于bootstrap的multiple-select下拉控件使用

multiple-select是一款优秀的下拉菜单控件,能够支持单选和多选. 详细参考文档: JS组件系列--两种bootstrap multiselect组件大比拼 multiple-select 本项目通过使用控件multiple-select实现动态创建单选和多选下拉控件 这里做个小说明:一开始我选用的控件为bootstrap-multiselect  后来,由于我的需求中有个要求:单选下拉默认是不需要有选中项,而bootstrap-multiselect默认会选中一个下拉,multipl

DevExpress控件GridView挂下拉控件无法对上值

下拉控件使用RepositoryItemLookUpEdit,加入如下事件进行处理. repositoryItemLookUpEdit1.CustomDisplayText += new DevExpress.XtraEditors.Controls.CustomDisplayTextEventHandler(repositoryItemLookUpEdit1_CustomDisplayText);

解决easyUI下拉控件无法触发onkeydown事件

实现在combotree下拉控件中按Backspace键清除combotree选中的值 下面的代码无法获取到键盘事件 <input class="easyui-combotree" id="tt" name="tt" onkeydown="if(event.keyCode==8) clear()"/> 原因是easyUI重新定义了键盘事件,解决如下: $("#tt").combotree({ u

下拉框、下拉控件之Select2。自动补全的使用

参考链接: 参考一:https://blog.csdn.net/weixin_36146275/article/details/79336158 参考二:https://www.cnblogs.com/wangchuanqi/p/5981212.html 参考三:https://www.cnblogs.com/sharpest/p/6117043.html 官网:https://select2.org/ 1.使用插件,首先要引入别人的插件了,你可以选择离线(无网络)或者在线引用的(如果有网络).

一款好看的可以插入图片的下拉控件

<!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>     <title></title>   

Html5下拉控件同时支持文本输入和下拉代码

有时候,下拉框不能满足我们的业务需求,还需要同时支持用户输入内容,默认的select标签是不支持用户输入的,下面我说一下原生的select如何支持用户输入,代码如下: <!DOCTYPE html> <html> <head> <title></title> </head> <body> <div style="position:relative;"> <span style=&quo

自定义下拉控件,点击屏幕别处收起下拉

/// <summary> /// 在调度消息之前将其筛选出来. /// </summary> /// <param name="m">要调度的消息.无法修改此消息.</param> /// <returns>如果筛选消息并禁止消息被调度,则为 true:如果允许消息继续到达下一个筛选器或控件,则为 false.</returns> public bool PreFilterMessage(ref Message

绑定下拉控件

DataTable dt = Utility.Getrole(); DroList.DataSource = dt; DroList.DataTextField = "description"; DroList.DataValueField = "name"; DroList.DataBind(); DroList.Items.Insert(0, new ListItem("请选择", "请选择")); SetDropList