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 相关文章推荐
jQuery函数map()和each()介绍及异同点分析
Nov 08 Javascript
浅谈JSON中stringify 函数、toJosn函数和parse函数
Jan 26 Javascript
解决JS无法调用Controller问题的方法
Dec 31 Javascript
jQuery实现的简单在线计算器功能
May 11 jQuery
jQuery回调方法使用示例
Jun 26 jQuery
vue+mockjs模拟数据实现前后端分离开发的实例代码
Aug 08 Javascript
jQuery实现右侧抽屉式在线客服功能
Dec 25 jQuery
微信小程序分享功能之按钮button 边框隐藏和点击隐藏
Jun 14 Javascript
vue实例中data使用return包裹的方法
Aug 27 Javascript
在vue项目中使用codemirror插件实现代码编辑器功能
Aug 27 Javascript
antd vue table跨行合并单元格,并且自定义内容实例
Oct 28 Javascript
Python机器学习之决策树和随机森林
Jul 15 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实现插入排序?
2013/04/10 PHP
yii2使用gridView实现下拉列表筛选数据
2017/04/10 PHP
PHP大文件分片上传的实现方法
2018/10/28 PHP
php数组函数array_push()、array_pop()及array_shift()简单用法示例
2020/01/26 PHP
JQuery Tips(4) 一些关于提高JQuery性能的Tips
2009/12/19 Javascript
jquery绑定原理 简单解析与实现代码分享
2011/09/06 Javascript
Jquery的hover方法让鼠标经过li时背景变色
2013/09/06 Javascript
jquery处理json数据实例分析
2014/06/03 Javascript
网页下载文件期间如何防止用户对网页进行其他操作
2014/06/27 Javascript
jQuery+ajax实现动态执行脚本的方法
2015/01/27 Javascript
图解Sublime Text3使用技巧
2015/12/21 Javascript
JS+HTML5实现上传图片预览效果完整实例【测试可用】
2017/04/20 Javascript
Vue.2.0.5实现Class 与 Style 绑定的实例
2017/06/20 Javascript
js中apply和Math.max()函数的问题及区别介绍
2018/03/27 Javascript
js字符串倒序的实例代码
2018/11/30 Javascript
jQuery实现的老虎机跑动效果示例
2018/12/29 jQuery
cordova+vue+webapp使用html5获取地理位置的方法
2019/07/06 Javascript
Vue组件基础用法详解
2020/02/05 Javascript
js+audio实现音乐播放器
2020/09/13 Javascript
python numpy 部分排序 寻找最大的前几个数的方法
2018/06/27 Python
Pycharm无法使用已经安装Selenium的解决方法
2018/10/13 Python
python实现剪切功能
2019/01/23 Python
python实现输出一个序列的所有子序列示例
2019/11/18 Python
python3操作注册表的方法(Url protocol)
2020/02/05 Python
Django路由层URLconf作用及原理解析
2020/09/24 Python
解决python3输入的坑——input()
2020/12/05 Python
使用css3 属性如何丰富图片样式(圆角 阴影 渐变)
2012/11/22 HTML / CSS
h5封装下拉刷新
2020/08/25 HTML / CSS
英国计算机产品零售商:Novatech(定制个人电脑、笔记本电脑、工作站和服务器)
2018/01/28 全球购物
英国家电购物网站:Sonic Direct
2019/03/26 全球购物
JD Sports丹麦:英国领先的运动时尚零售商
2020/11/24 全球购物
双创工作实施方案
2014/03/26 职场文书
车辆工程专业求职信
2014/04/28 职场文书
慈善献爱心倡议书
2015/04/27 职场文书
超市主管竞聘书
2015/09/15 职场文书
2015小学新教师个人工作总结
2015/10/14 职场文书