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 CSS修改学习第二章 样式
Feb 19 Javascript
基于JQuery的cookie插件
Apr 07 Javascript
javascript中局部变量和全局变量的区别详解
Feb 27 Javascript
javascript中对变量类型的判断方法
Aug 09 Javascript
js实现不重复导入的方法
Mar 02 Javascript
JS判断元素是否在数组内的实现代码
Mar 30 Javascript
Knockoutjs 学习系列(二)花式捆绑
Jun 07 Javascript
jquery实现多次上传同一张图片
Jan 09 Javascript
全面总结Javascript对数组对象的各种操作
Jan 22 Javascript
基于cropper.js封装vue实现在线图片裁剪组件功能
Mar 01 Javascript
JS封装的模仿qq右下角消息弹窗功能示例
Aug 22 Javascript
微信小程序列表中item左滑删除功能
Nov 07 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
[FAQ]PHP中的一些常识:类篇
2006/10/09 PHP
php fsockopen伪造post与get方法的详解
2013/06/14 PHP
php生成静态页面的简单示例
2014/04/17 PHP
Laravel利用gulp如何构建前端资源详解
2018/06/03 PHP
Laravel 实现添加多语言提示信息
2019/10/25 PHP
一个简单的JavaScript 日期计算算法
2009/09/11 Javascript
javascript 中String.match()与RegExp.exec()的区别说明
2013/01/10 Javascript
jquery使用jxl插件导出excel示例
2014/04/14 Javascript
jQuery中用dom操作替代正则表达式
2014/12/29 Javascript
jQuery中has()方法用法实例
2015/01/06 Javascript
js中键盘事件实例简析
2015/01/10 Javascript
js实现使用鼠标拖拽切换图片的方法
2015/05/04 Javascript
Jquery为DIV添加click事件的简单实例
2016/06/02 Javascript
js 弹出对话框(遮罩)透明,可拖动的简单实例
2016/07/11 Javascript
详解angularjs中如何实现控制器和指令之间交互
2017/05/31 Javascript
深入理解angular2启动项目步骤
2017/07/15 Javascript
jquery获取transform里的值实现方法
2017/12/12 jQuery
微信{"errcode":48001,"errmsg":"api unauthorized, hints: [ req_id: 1QoCla0699ns81 ]"}
2018/10/12 Javascript
Vue学习之axios的使用方法实例分析
2020/01/06 Javascript
JS实现简单打字测试
2020/06/24 Javascript
Python压缩解压缩zip文件及破解zip文件密码的方法
2015/11/04 Python
Python 面试中 8 个必考问题
2018/11/16 Python
python字符串切割:str.split()与re.split()的对比分析
2019/07/16 Python
python实现将两个文件夹合并至另一个文件夹(制作数据集)
2020/04/03 Python
keras-siamese用自己的数据集实现详解
2020/06/10 Python
iframe跨域的几种常用方法
2019/11/11 HTML / CSS
美国农场商店:Blain’s Farm & Fleet
2020/01/17 全球购物
介绍一下常见的木马种类
2014/11/15 面试题
建筑工程毕业生自我鉴定
2014/01/14 职场文书
红领巾广播站广播稿
2014/02/01 职场文书
小学运动会口号
2014/06/07 职场文书
孝敬父母的活动方案
2014/08/28 职场文书
德能勤绩廉个人总结
2015/02/14 职场文书
2015学校师德师风工作总结
2015/04/22 职场文书
Feign调用传输文件异常的解决
2021/06/24 Java/Android
nginx共享内存的机制详解
2022/03/21 Servers