jQuery 操作下拉列表框实现代码


Posted in Javascript onFebruary 22, 2010

<select name="select1" id="select1" size="10">
<option value="1">Option1</option>
<option valeu="2">Option2</option>
<option value="3">Option3</option>
<option value="4">Option4</option>
</select>

1. 取得jQuery对象
obj = $('#select1');

2. 取得Options 的长度
len = $('#select1 option').length

3. 遍历option
for (var i = 0; i < len; i++) {
option_value = obj[0].options[i].value;
option_text = obj[0].options[i].text;
}

4. 取得所选值
obj_value = $('#select1').val();

5. 取得所选值对应的text
obj_text = obj[0].options[obj[0].selectedIndex].text;

6. 添加一个option
obj.append('<option value="5">Option5</option>');

7. 删除一个option
$('#select1 option[value="1"]').remove();

Javascript 相关文章推荐
Javascript----文件操作
Jan 18 Javascript
用JQuery在网页中实现分隔条功能的代码
Aug 09 Javascript
解析jquery获取父窗口的元素
Jun 26 Javascript
JavaScript实现下拉菜单的显示和隐藏
Jan 05 Javascript
微信小程序 参数传递实例代码
Mar 20 Javascript
vue2实现移动端上传、预览、压缩图片解决拍照旋转问题
Apr 13 Javascript
Vue结合Video.js播放m3u8视频流的方法示例
May 04 Javascript
解决vue移动端适配问题
Dec 12 Javascript
使用vue for时为什么要key【推荐】
Jul 11 Javascript
一文看懂如何简单实现节流函数和防抖函数
Sep 05 Javascript
Vue结合路由配置递归实现菜单栏功能
Jun 16 Javascript
JavaScript实现酷炫的鼠标拖尾特效
Feb 18 Javascript
JavaScript 编写匿名函数的几种方法
Feb 21 #Javascript
jquery 得到当前页面高度和宽度的两个函数
Feb 21 #Javascript
jquery validator 插件增加日期比较方法
Feb 21 #Javascript
javascript 定义新对象方法
Feb 20 #Javascript
Jquery乱码的一次解决过程 图解教程
Feb 20 #Javascript
JavaScript CSS修改学习第六章 拖拽
Feb 19 #Javascript
JavaScript CSS修改学习第五章 给“上传”添加样式
Feb 19 #Javascript
You might like
收集的php编写大型网站问题集
2007/03/06 PHP
ThinkPHP字符串函数及常用函数汇总
2014/07/18 PHP
PHP实现数组转JSon和JSon转数组的方法示例
2018/06/14 PHP
PHP XML Expat解析器知识点总结
2019/02/15 PHP
锋利的jQuery jQuery中的DOM操作
2010/03/21 Javascript
一个js控制的导航菜单实例代码
2013/12/03 Javascript
jquery结婚电子请柬特效源码分享
2015/08/21 Javascript
Bootstrap创建可折叠的组件
2016/02/23 Javascript
JavaScript中的this引用(推荐)
2016/08/05 Javascript
jQuery+CSS3实现点赞功能
2017/03/13 Javascript
javascript简单写的判断电话号码实例
2017/05/24 Javascript
关于javascript获取内联样式与嵌入式样式的实例
2017/06/01 Javascript
微信小程序三级联动地址选择器的实例代码
2017/07/12 Javascript
基于JS递归函数细化认识及实用实例(推荐)
2017/08/07 Javascript
深入理解ES6 Promise 扩展always方法
2017/09/26 Javascript
webpack 3.X学习之多页面打包的方法
2018/09/04 Javascript
js 实现在2d平面上画8的方法
2018/10/10 Javascript
Vue $mount实战之实现消息弹窗组件
2019/04/22 Javascript
详解微信小程序胶囊按钮返回|首页自定义导航栏功能
2019/06/14 Javascript
nodejs各种姿势断点调试的方法
2020/06/18 NodeJs
[01:01:36]Optic vs paiN 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
Python实现获取某天是某个月中的第几周
2015/02/11 Python
Python实现高斯函数的三维显示方法
2018/12/29 Python
python实现两个dict合并与计算操作示例
2019/07/01 Python
如何用python写个模板引擎
2021/01/14 Python
Parfumdreams芬兰:购买香水和化妆品
2021/02/13 全球购物
学前班教师的自我鉴定
2013/12/05 职场文书
爱我中华演讲稿
2014/05/20 职场文书
安全宣传标语
2014/06/10 职场文书
乡镇四风对照检查材料
2014/08/31 职场文书
工伤事故赔偿协议书范文
2014/09/24 职场文书
电影雨中的树观后感
2015/06/15 职场文书
《自己去吧》教学反思
2016/02/16 职场文书
高中优秀作文(范文)
2019/08/15 职场文书
如何使用Maxwell实时同步mysql数据
2021/04/08 MySQL
解决pytorch 损失函数中输入输出不匹配的问题
2021/06/05 Python