select添加option
本文介绍select添加option的两种方法
1、使用selectObject.add(option,before)方法,其中
option为要添加选项元素。必需是 option 或 optgroup 元素
before为在选项数组的该元素之前增加新的元素。如果该参数是null,元素添加到选项数组的末尾
2、new一个option对象,然后把它添加到select中
dom结构如下:
<select name="mySelect" id="mySelect">
<option value="请选择">请选择</option>
</select>
js代码如下:
var mySelect = document.getElementById("mySelect");
var addOption1 = function(select,txt,value,num){
select.add(new Option(txt,value),num);
}
var addOption2 = function(select,txt,value){
var opt = new Option(txt,value);
console.log(typeof opt)
select.appendChild(opt);
}
addOption1(mySelect,"A","a");
addOption1(mySelect,"first","1",0);
addOption2(mySelect,"B","b");
效果如下:
如有表述不准确之处,欢迎指正,欢迎补充,感谢阅读。
select添加option的更多相关文章
- 纯js遍历json获取值动态为select添加option
遍历json数组 并动态为select添加option 直接上代码,重要部分有注解 <!DOCTYPE html> <html lang="en"> < ...
- JavaScript为select添加option,select选项变化时的处理,获取slelect被选中的值
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- js为select添加option
<select id="shi"> function loadInfo(){ var shengId=document.getElementById("she ...
- select初始化添加option,通过标签给出回显值,由于回显值和初始化值option中有一个值重复,去重等问题!
第一张图片: 第二张图片 /** *该方法是为了去重,所谓去重就是 因为回显给select附上了值并设置为selected选中状态,而在我们初始化所有的select添加option元素中于回显的值重复 ...
- select元素添加option的add()方法 | try{}catch{}
1.javascript中的select元素添加option使用add()方法 select的add方法,第一个参数是需要被添加的option元素,第二个参数决定了被添加的位置 普通浏览器中,第二个参 ...
- select 中添加option的注意
在平时写JS中经常要给Select添加option,如果我们把option中的数据用一个字符串来表示: eg: var strOption='<option>1</option> ...
- select 动态添加option函数
转自:https://lym6520.iteye.com/blog/309937 经常会用到select动态添加元素,写了个方法,方便调用! ... /** * 功能:select对象动态添加Opt ...
- layui select动态添加option
<form class="layui-form" action=""> <div class="layui-form-item pr ...
- IE8下JQuery clone 出的select元素使用append添加option异常解决记录
遇到一个怪现象,由于配置参数是多实例的, 故采用JQuery对模板HTML代码进行clone, HTML代码中包括select标签, 在克隆之后需要对select进行添加option. 在firefo ...
随机推荐
- 剑指offer(3)从尾到头打印链表
题目描述 输入一个链表,从尾到头打印链表每个节点的值. 题目分析 比较简单,主要注意下从尾到头,可以用栈可以用递归,我给出我比较喜欢的代码吧 代码 /* function ListNode(x){ t ...
- UnicodeMath数学公式编码_翻译(Unicode Nearly Plain - Text Encoding of Mathematics Version 3)
目录 完整目录 1. 简介 2. 编码简单数学表达式 2.1 分数 2.2 上标和下标 2.3 空白(空格)字符使用 3. 编码其他数学表达式 3.1 分隔符 强烈推荐本文简明版UnicodeMath ...
- vi删除当前行的字符
x 删除当前光标下的字符dw 删除光标之后的单词剩余部分.d$ 删除光标之后的该行剩余部分.dd 删除当前行
- SpringMVC 搭建
1. 新建一个项目 Paste_Image.png 我们用eclipse新建项目,选择Dynamic Web Project(动态的Web项目). 点击Next Paste_Image.png ...
- jquery 判断元素是否可见
if($('#progress_bar').is(":visible")){ $('#progress_bar').hide(); }
- Redhat配置yum源(使用阿里云yum Repo)
1. 查看版本号和系统类别: cat /etc/redhat-release archor cat /etc/issue && arch 2.检查yum是否安装,以及安装了哪些依赖源并 ...
- R 语言 decostand() 函数
参考自:https://wenku.baidu.com/view/ae5f76f94b35eefdc9d3336e.html
- Cordova结合Vue学习Camera
简单聊两句 学习Vue+Cordova打包编译App,首先你要安装Cordova与vue,在这里本人就不说明了,自行看文档与搜索相关资料. Cordova中文官网地址 Vue中文官网地址 第一步:首先 ...
- hibernate 的API使用
1.Query对象:不需要写sql语句,但需要hql语句,和sql很类似 (1)sql和hql区别:sql操作表和表字段,hql操作实体和实体属性 (2)使用: 2.Criteria对象:不需要写语句 ...
- python3中 getpass模块使用
getpass在IDLE中报错 CMD中可以使用 import getpass usr = getpass.getuser print(usr) 返回值为当前windows登陆用户名