javascript options属性集合操作代码


Posted in Javascript onDecember 28, 2009
<form name="testform"> 
<select name="testselect"> 
<option value="first">first option</option> 
<option value="second">second option</option> 
<option value="third">third option</option> 
<option>your browser can't handle this script</option> 
</select> 
</form>

用下面的代码可以访问到下拉框中选项:
// 得到选项对象 
document.forms['testform'].testselect.options[i]

如果你想删除option
document.forms['testform'].testselect.options[i] = null;

把这个选项对象标志为null,这个选项就完全从列表中删除了。
注意:这个操作会影响option的数量。假设在上面的实例中,你删除了option[1] ,原来的option[2] 元素('Third option')会变成option[1] 元素(option元素按照先后顺序顶上去)。
创建一个新的option,如下:
document.forms['testform'].testselect.options[i] = new Option('new text','new value');

用户在页面中看到option显示的文本和value值是这个option的VALUE 属性。
当表单提交时,VALUE 值传递到WEB服务器。
如果想要全部清空 select box 中的options, 如下:
document.forms['testform'].testselect.option.length = 0;
Javascript 相关文章推荐
通过js脚本复制网页上的一个表格的不错实现方法
Dec 29 Javascript
图解Sublime Text3使用技巧
Dec 21 Javascript
jquery事件绑定解绑机制源码解析
Sep 19 Javascript
js利用appendChild对标签进行排序的实现方法
Oct 16 Javascript
Jquery Easyui分割按钮组件SplitButton使用详解(17)
Dec 18 Javascript
angular写一个列表的选择全选交互组件的示例
Jan 22 Javascript
新手必须知的Node.js 4个JavaScript基本概念
Sep 16 Javascript
JS函数节流和防抖之间的区分和实现详解
Jan 11 Javascript
JavaScript动态创建二维数组的方法示例
Feb 01 Javascript
Angular2使用SVG自定义图表(条形图、折线图)组件示例
May 10 Javascript
layui使用数据表格实现购物车功能
Jul 26 Javascript
ES6中的Javascript解构的实现
Oct 30 Javascript
javascript 动态调整图片尺寸实现代码
Dec 28 #Javascript
jquery $(document).ready() 与window.onload的区别
Dec 28 #Javascript
jQuery的强大选择器小结
Dec 27 #Javascript
IE6 弹出Iframe层中的文本框“经常”无法获得输入焦点
Dec 27 #Javascript
JavaScript 拾漏补遗
Dec 27 #Javascript
js 实现无干扰阴影效果 简单好用(附文件下载)
Dec 27 #Javascript
向大师们学习Javascript(视频与PPT)
Dec 27 #Javascript
You might like
PHP如何透过ODBC来存取数据库
2006/10/09 PHP
smarty 原来也不过如此~~呵呵
2006/11/25 PHP
PHP中for与foreach的区别分析
2011/03/09 PHP
php中强制下载文件的代码(解决了IE下中文文件名乱码问题)
2011/05/09 PHP
基于php常用函数总结(数组,字符串,时间,文件操作)
2013/06/27 PHP
YII2框架中ActiveDataProvider与GridView的配合使用操作示例
2020/03/18 PHP
兼容IE、FireFox、Chrome等浏览器的xml处理函数js代码
2011/11/30 Javascript
给html超链接设置事件不使用href来完成跳
2014/04/20 Javascript
JavaScript实现的一个计算数字步数的算法分享
2014/12/06 Javascript
jQuery实现的产品自动360度旋转展示特效源码分享
2015/08/21 Javascript
基于iscroll.js实现下拉刷新和上拉加载效果
2016/11/28 Javascript
详解用node搭建简单的静态资源管理器
2017/08/09 Javascript
javaScript之split与join的区别(详解)
2017/11/08 Javascript
JS实现登录页密码的显示和隐藏功能
2017/12/06 Javascript
VSCode使用之Vue工程配置eslint
2019/04/30 Javascript
js核心基础之构造函数constructor用法实例分析
2019/05/11 Javascript
Promise扫盲贴
2019/06/24 Javascript
python中sets模块的用法实例
2014/09/30 Python
详解Python中的__getitem__方法与slice对象的切片操作
2016/06/27 Python
python的pdb调试命令的命令整理及实例
2017/07/12 Python
DataFrame 将某列数据转为数组的方法
2018/04/13 Python
python实现彩色图转换成灰度图
2019/01/15 Python
python 实现GUI(图形用户界面)编程详解
2019/07/17 Python
Django中使用Json返回数据的实现方法
2020/06/03 Python
利用CSS3的flexbox实现水平垂直居中与三列等高布局
2016/09/12 HTML / CSS
地球上最先进的胡子和头发修剪器:Bevel
2018/01/23 全球购物
施华洛世奇日本官网:SWAROVSKI日本
2018/05/04 全球购物
毕业生自我推荐
2013/11/04 职场文书
工作会议主持词
2014/03/17 职场文书
租房协议书
2014/04/10 职场文书
正风肃纪剖析材料
2014/09/30 职场文书
法院干警四风问题个人对照检查材料思想汇报
2014/10/07 职场文书
音乐教师个人总结
2015/02/06 职场文书
Python爬虫实战之爬取京东商品数据并实实现数据可视化
2021/06/07 Python
关于python3 opencv 图像二值化的问题(cv2.adaptiveThreshold函数)
2022/04/04 Python
python+opencv实现目标跟踪过程
2022/06/21 Python