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 相关文章推荐
document对象execCommand的command参数介绍
Aug 01 Javascript
javascript 面向对象编程 万物皆对象
Sep 17 Javascript
jquery ajax 登录验证实现代码
Sep 23 Javascript
基于jquery的下拉框改变动态添加和删除表格实现代码
Sep 12 Javascript
Node.js开源应用框架HapiJS介绍
Jan 14 Javascript
jquery利用命名空间移除绑定事件的方法
Mar 11 Javascript
基于jquery实现图片上传本地预览功能
Jan 08 Javascript
BootStrap Datetimepicker 汉化的实现代码
Feb 10 Javascript
浅谈MUI框架中加载外部网页或服务器数据的方法
Jan 31 Javascript
Element Input组件分析小结
Oct 11 Javascript
JS实现简单的文字无缝上下滚动功能示例
Jun 22 Javascript
JavaScript 获取滚动条位置并将页面滑动到锚点
Feb 08 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 ZipArchive压缩函数详解实例
2013/11/06 PHP
PHP多进程编程总结(推荐)
2016/07/18 PHP
Zend Framework教程之Zend_Helpers动作助手ViewRenderer用法详解
2016/07/20 PHP
laravel dingo API返回自定义错误信息的实例
2019/09/29 PHP
laravel withCount 统计关联数量的方法
2019/10/10 PHP
Yii使用DbTarget实现日志功能的示例代码
2020/07/21 PHP
PHP连接SQL server数据库测试脚本运行实例
2020/08/24 PHP
jQuery checkbox全选/取消全选实现代码
2009/11/14 Javascript
jQuery中element选择器用法实例
2014/12/29 Javascript
jquery图片轮播特效代码分享
2020/04/20 Javascript
7个去伪存真的JavaScript面试题
2016/01/07 Javascript
javascript每日必学之基础入门
2016/02/16 Javascript
js停止冒泡和阻止浏览器默认行为的简单方法
2016/05/15 Javascript
全面解析Bootstrap中nav、collapse的使用方法
2016/05/22 Javascript
AngularJs concepts详解及示例代码
2016/09/01 Javascript
Angular2 路由问题修复详解
2017/03/01 Javascript
利用js查找数组中指定元素并返回该元素的所有索引示例
2017/03/29 Javascript
zTree获取当前节点的下一级子节点数实例
2017/09/05 Javascript
详解在vue-cli项目中使用mockjs(请求数据删除数据)
2017/10/23 Javascript
Vue项目中添加锁屏功能实现思路
2018/06/29 Javascript
微信小程序实现左滑修改、删除功能
2020/10/19 Javascript
Vue.js组件使用props传递数据的方法
2019/10/19 Javascript
微信小程序中的video视频实现 自定义播放按钮、封面图、视频封面上文案
2020/01/02 Javascript
python直接访问私有属性的简单方法
2016/07/25 Python
Python 元类实例解析
2018/04/04 Python
django与小程序实现登录验证功能的示例代码
2019/02/19 Python
详解Python函数式编程—高阶函数
2019/03/29 Python
关于pytorch中全连接神经网络搭建两种模式详解
2020/01/14 Python
印度尼西亚最大和最全面的网络商城:Blibli.com
2017/10/04 全球购物
创先争优演讲稿
2014/09/15 职场文书
校园运动会广播稿
2014/10/06 职场文书
党员倡议书
2015/01/19 职场文书
小学四年级作文之写景
2019/08/23 职场文书
CSS3 制作精美的定价表
2021/04/06 HTML / CSS
python glom模块的使用简介
2021/04/13 Python
Python使用Beautiful Soup(BS4)库解析HTML和XML
2022/06/05 Python