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 bind事件使用详解
May 05 Javascript
如何使用JS获取IE上传文件路径(IE7,8)
Jul 08 Javascript
jQuery怎么解析Json字符串(Json格式/Json对象)
Aug 09 Javascript
js防止表单重复提交的两种方法
Sep 30 Javascript
Web前端开发工具——bower依赖包管理工具
Mar 29 Javascript
jQuery Validate插件实现表单验证
Aug 19 Javascript
JS触摸事件、手势事件详解
May 04 Javascript
Vue调试神器vue-devtools安装方法
Dec 12 Javascript
详解node.js中的npm和webpack配置方法
Jan 21 Javascript
微信小程序实现城市列表选择
Jun 05 Javascript
浅谈Webpack多页应用HMR卡住问题
Apr 24 Javascript
浅谈vue-router路由切换 组件重用挖下的坑
Nov 01 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
星际争霸 Starcraft 游戏介绍
2020/03/14 星际争霸
php5 non-thread-safe和thread-safe这两个版本的区别分析
2010/03/13 PHP
php中实现简单的ACL 完结篇
2011/09/07 PHP
教你如何用php实现LOL数据远程获取
2014/06/10 PHP
php使用Imagick生成图片的方法
2015/07/31 PHP
PHP图片加水印实现方法
2016/05/06 PHP
PHP mongodb操作类定义与用法示例【适合mongodb2.x和mongodb3.x】
2018/06/16 PHP
在PHP中实现使用Guzzle执行POST和GET请求
2019/10/15 PHP
通过PHP实现用户注册后邮箱验证激活
2020/11/10 PHP
javascript让setInteval里的函数参数中的this指向特定的对象
2010/01/31 Javascript
Jquery判断IE6等浏览器的代码
2011/04/05 Javascript
在标题栏显示新消息提示,很多公司项目中用到这个方法
2011/11/04 Javascript
js控制iframe的高度/宽度让其自适应内容
2014/04/09 Javascript
jQuery实现Twitter的自动文字补齐特效
2014/11/28 Javascript
jQuery实现简洁的导航菜单效果
2015/11/23 Javascript
html+javascript+bootstrap实现层级多选框全层全选和多选功能
2017/03/09 Javascript
vue.js全局API之nextTick全面解析
2017/07/07 Javascript
Vue渲染函数详解
2017/09/15 Javascript
vue+iview+less 实现换肤功能
2018/08/17 Javascript
深入理解javascript prototype的相关知识
2019/09/19 Javascript
p5.js临摹动态图形的方法
2019/10/23 Javascript
Vue实现图片轮播组件思路及实例解析
2020/05/11 Javascript
在Uni中使用Vue的EventBus总线机制操作
2020/07/31 Javascript
python结合opencv实现人脸检测与跟踪
2015/06/08 Python
深入讲解Python编程中的字符串
2015/10/14 Python
pandas修改DataFrame列名的方法
2018/04/08 Python
selenium获取当前页面的url、源码、title的方法
2019/06/12 Python
python基于selenium爬取斗鱼弹幕
2021/02/20 Python
html5-websocket基于远程方法调用的数据交互实现
2012/12/04 HTML / CSS
公司请假条范文
2014/04/11 职场文书
自主招生推荐信范文
2014/05/10 职场文书
党的群众路线领导班子整改方案
2014/09/27 职场文书
离婚协议书范本及离婚须知
2014/10/15 职场文书
大学推普周活动总结
2015/05/07 职场文书
Nginx开启Brotli压缩算法实现过程详解
2021/03/31 Servers
python之json文件转xml文件案例讲解
2021/08/07 Python