Jquery操作select小结
每次操作select都要查资料,干脆总结一下。
为select设置placeholder
<select class="form-control selOP" placeholder="Pick Orchestration Plan"><option value="" disabled selected style='display:none;'>Pick Orchestration Plan</option><option value="Residential">Quad Play</option><option value="Residential West">Plan 1</option> </select>
为Select添加事件,当选择其中一项时触发
$("#select_id").change(function(){//code... });
jQuery获取Select选择的Text和Value:
var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text//var $(#testSelect option:selected').text(); var checkValue=$("#select_id").find("option:selected").val(); //获取Select选择的Value var checkIndex=$("#select_id ").get(0).selectedIndex; //获取Select选择的索引值 var maxIndex=$("#select_id option:last").attr("index"); //获取Select最大的索引值
jQuery设置Select选择的Text和Value:
$("#select_id ").get(0).selectedIndex=1; //设置Select索引值为1的项选中 $("#select_id ").val(4); //设置Select的Value值为4的项选中 $("#select_id option[text='jQuery']").attr("selected", true); //设置Select的Text值为jQuery的项选中
jQuery添加/删除Select的Option项:
$("#select_id").append("<option value='Value'>Text</option>"); //为Select追加一个Option(下拉项) $("#select_id").prepend("<option value='0'>请选择</option>"); //为Select插入一个Option(第一个位置) $("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个) $("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个) $("#select_id option[value='3']").remove(); //删除Select中Value='3'的Option $("#select_id option[text='4']").remove(); //删除Select中Text='4'的Option
遍历option和添加、移除option
function changeShipMethod(shipping){var len = $("select[@name=ISHIPTYPE] option").length;if(shipping.value != "CA"){$("select[@name=ISHIPTYPE] option").each(function(){if($(this).val() == 111){$(this).remove();}});}else{$("<option value='111'>UPS Ground</option>").appendTo($("select[@name=ISHIPTYPE]"));} }
清空下拉框
$("#sel").empty();document.all.objSelect.options.length = 0;
控制表单元素:
- 文本框,文本区域:
$("#txt").attr("value",'');//清空内容 $("#txt").attr("value",'11');//填充内容
- 多选框checkbox:
$("#chk1").attr("checked",'');//不打勾 $("#chk2").attr("checked",true);//打勾 if($("#chk1").attr('checked')==undefined) //判断是否已经打勾
- 单选组radio:
$("input[@type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项
- 下拉框select:
$("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项 $("<option value='1'>1111</option><option value='2'>2222</option>").appendTo("#sel")//添加下拉框的option
转载于:https://www.cnblogs.com/JoannaQ/p/3715307.html
Jquery操作select小结相关推荐
- jQuery操作Select
jQuery是如何控制和操作select的.先看下面的html代码 <select id="test"><option value="1"&g ...
- jQuery: 操作select option方法集合
每一次操作select的时候,总是要谷歌一下资料,真是太不爽了, 在这里记录一下. 公共select代码 <select id="sel"><option val ...
- jquery操作select下拉框的各种方法,获取选中项的值或文本,根据指定的值或文本选中select的option项等...
简介jquery里对select进行各种操作的方法,如联动.取值.根据值或文本来选中指定的select下拉框指定的option选项,读取select选中项的值和文本等. 这一章,站长总结一下jquer ...
- jquery操作select时怎么产生事件
jquery操作select时怎么产生事件 jquery操作select时怎么产生事件, 如我设置2为选中项 $('#select').val("2"); 哪么怎么同时产生一个on ...
- ajax 给select赋值,jquery操作select取值赋值与设置选中
摘要 腾兴网为您分享:jquery操作select取值赋值与设置选中,掌上优云,杂志迷,悦作业,小米云盘等软件知识,以及屏幕,赢在街拍客,动图,天下任我行,网易充值中心,马上用车,cf不掉血,回收ap ...
- jquery操作select取值赋值与设置选中[转]
本节内容: jquery实现select下拉框的取值与赋值,设置选中的方法大全. 比如<select class="selector"></select> ...
- jquery操作select(增加,删除,清空)
jQuery获取Select选择的Text和Value: 引用https://www.cnblogs.com/Luouy/p/5806833.html $("#select_id" ...
- jquery操作select选项
$("#typeSelect option[value!=6]").remove() jQuery获取Select选择的Text和Value: var checkText=jQue ...
- jq select 修改选中_「jquery select」jquery操作select(取值,设置选中) - seo实验室
jquery select 最近工作中总出现select 和 option问题,整理一下,内容大部分源于网络资料 一.基础取值问题 例如 1.设置value为pxx的项选中 $(".sele ...
最新文章
- AI时代,产品经理需要掌握的5项新技能
- 动态注册客户端脚本的方法
- mysql vim 退不出_字符集问题之 MySQL, Linux终端, vim
- 生成验证码图片的Java代码
- 数据源 连接oracle
- linux输入过的命令行,LINUX中命令行的历史记录和编辑
- Android 学习JNI,用JAVA调用C
- 注意,Windows7只能安装Python 3.8以下的版本
- AI再造一个“李佳琦”,难嘛?
- 用视频录制软件Captura学习网课
- zz 主要分类方法介绍
- 《庄子·杂篇·列御寇第三十二》
- MYSQL、JDBC
- 60几行代码绘制丘比特爱情之箭!
- java的db是什么_java db
- 阿里云-个人建网站从0到精通(一)
- Golang线程池gpool
- 通俗讲解单片机、ARM、MUC、DSP、FPGA、嵌入式错综复杂的关系
- 《C++ STL编程实战》读书笔记(四)
- 2019校招面经大汇总
热门文章
- 数据库安装mysql57_记录CentOS7.X版本下安装MySQL5.7数据库
- 根据oracle入库数据进行告警,Oracle 启动故障案例之--ORA-600 [4193]错误
- 莫凡机器学习课程笔记
- python 的按位与 或 异或 运算
- 五分钟搞懂后缀数组!
- layer的删除询问框的使用
- java getClass()
- [mysql] linux下使用yum安装mysql
- java基础篇---网络编程(UDP程序设计)
- 2013.7.15DAY2