关于new Option()
先来了解下,如何运用js实现select动态添加option。
//1.动态创建select
function createSelect(){
var mySelect = document.createElement("select");
mySelect.id = "mySelect";
document.body.appendChild(mySelect);
} //2.添加选项option
function addOption(){
//根据id查找对象,
var obj=document.getElementById('mySelect');
//添加一个选项
obj.add(new Option("文本","值")); //方法一:
obj.options.add(new Option("text","value")); //方法二:
for(var i=0;i<10;i++){
obj.options[i]=new Option("新文本","新值"); //方法三:
}
} //3.删除所有选项option
function removeAll(){
var obj=document.getElementById('mySelect');
obj.options.length=0;
} //4.删除一个选项option
function removeOne(){
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //index,要删除选项的序号
obj.options.remove(index);
} //5.获得选项option的值
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //序号,取当前选中选项的序号
var val = obj.options[index].value; //6.获得选项option的文本
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex;
var val = obj.options[index].text; //7.修改选项option
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex;
var val = obj.options[index]=new Option("新文本","新值"); //8.删除select
function removeSelect(){
var mySelect = document.getElementById("mySelect");
mySelect.parentNode.removeChild(mySelect);
}
例子中,用到add() 方法
用于向 <select> 添加一个 <option> 元素。
selectObject.add(option,before)
| option | 必需。要添加选项元素。必需是 option 或 optgroup 元素。 |
| before | 必需。在选项数组的该元素之前增加新的元素。如果该参数是null,元素添加到选项数组的末尾。 |
关于new Option()的更多相关文章
- 在 C# 里使用 F# 的 option 变量
在使用 C# 与 F# 混合编程的时候(通常是使用 C# 实现 GUI,F#负责数据处理),经常会遇到要判断一个 option 是 None 还是 Some.虽然 Option module 里有 i ...
- jsPanel插件Option总结
jsPanel插件Option总结 学习jsPanel之余对相关的选项进行了总结,便于参考. # 选项名称 类别 简要说明 1 autoclose configuration 设置一个时间在毫秒后,面 ...
- jquery option
转--jquery动态添加option示例 http://www.jb51.net/article/45031.htm //js动态添加option var sel= document.getElem ...
- 一个解析json串并组装echarts的option的函数解析
缘起: 在组装echart页面的时候,遇到这样一个问题,它是一个需要在循环内层的时候,同时循环外层,在内层循环中就要将外层获取的值存入,导致了一种纠缠状态,费了老劲儿,终于得到如下解决.记录之,绿色为 ...
- AngularJS下拉列表select在option动态变化之后多出了一个错误项的问题
场景: Select初始化之后,选中select的某个选项 通过AngularJS更新select的选项 错误写法: HTML(使用ng-repeat) <div ng-app="Te ...
- select初始化添加option,通过标签给出回显值,由于回显值和初始化值option中有一个值重复,去重等问题!
第一张图片: 第二张图片 /** *该方法是为了去重,所谓去重就是 因为回显给select附上了值并设置为selected选中状态,而在我们初始化所有的select添加option元素中于回显的值重复 ...
- 解决 odoo.py: error: option --addons-path: The addons-path 'local-addons/' does not seem to a be a valid Addons Directory!
情况说明 odoo源文件路径-/odoo-dev/odoo/: 我的模块插件路径 ~/odoo-dev/local-addons/my-module 在my-module中创建了__init__.py ...
- echarts中显示效果option中必有的属性
写一个最简单的效果让option中不可缺少的属性. var option = { xAxis:[ //x轴,数组对象,其下至少有一个对象 {.....} ], yAxis:[//y轴,数组对象,其下可 ...
- 让 select 的 option 标签支持事件监听(如复制操作)
这标题,让option支持事件监听,应该不难的呀,有什么好讲的? 其实还是有的,默认在浏览器代码是无法直接对option标签进行操作的,不仅包括JS事件监听,还是CSS样式设置 查了一些资料,姑且认为 ...
- 扩展htmlhelper.DropDownListFor 支持list数据源和option增加属性
mvc自带的DropDownListFor数据源必须是IEnumerable<SelectListItem>.并且option不支持增加自定义属性.在使用bootstrap-select组 ...
随机推荐
- centos 7 Hadoop2.7.4完全分布式搭建(一)
(一)系统准备与安装 1.准备下载centos7 (百度自行下载)可以到开源镜像站下载,速度比较快,比如清华的或者阿里的 在vmware上安装 这里我用的是vmware12 打开Vmware 选择文件 ...
- delphi sqlsever 实现存在则更新,不存在
(' if exists(select * from NBcommission where Type='''+sType+'''and ItemNo='''+s+''' ) '+ ' begin'+ ...
- RobotFramework与Jenkins集成后构建成功率高于设置阈值但总是显示失败
摘要:robot执行后总是失败 1.在配置jenkins的job时,添加构建步骤Execute Windows batch command,输入执行robotframework测试用例命令 2.然后j ...
- NuGet文件下载与应用
nuget是一款.net下强大的包管理开发工具,Visual Studio 2013和Visual Studio 2015都缺省支持Nuget.在线开发能享受到Nuget的便利,但是如果是离线开发,还 ...
- 使用System.Data.SQLite及其EF模块操作SQLite数据库(文件)
SQLite for .NET (System.Data.SQLite) introduction An ADO.NET provider for SQLite including EF and Li ...
- iis 部署webapi常见错误及解决方案
iis 部署webapi常见错误及解决方案 错误一: 原因:asp.net web api部署在Windows服务器上后,按照WebAPI定义的路由访问,老是出现404,但定义一个静态文件从站点访问, ...
- FTP ftp部署遇到问题
FTP ftp部署遇到问题 一. 二.
- python中readline判断文件读取结束的方法
注:内容来自网络 本文实例讲述了python中readline判断文件读取结束的方法.分享给大家供大家参考.具体分析如下: 大家知道,python中按行读取文件可以使用readline函数,下面现介绍 ...
- 【07】循序渐进学 docker:数据持久化
写在前面的话 学到这里相信有心的朋友都发现问题了,我们每次都会去删掉容器,在创建新的容器.那数据怎么办?岂不删库跑路了? 就算不是数据库,假设公司有日志保留的需求,那每一次发布岂不日志都被干掉了? D ...
- chipmunk 物理引擎的基本概念和基本用法
chipmunk是一个开源2D物理引擎, 项目主页:http://code.google.com/p/chipmunk-physics/ 工作需要研究了一下,这个引擎的资料还是不多,我阅读了所有的文档 ...