JS操作select下拉框动态变动(创建/删除/获取)


Posted in Javascript onJune 02, 2013

1.动态创建select

function createSelect(){ 
var mySelect = document.createElement_x("select"); 
mySelect.id = "mySelect"; 
document.body.appendChild(mySelect); 
}

2.添加选项option
function addOption(){ 
//根据id查找对象, 
var obj=document.getElementByIdx_x('mySelect'); 
//添加一个选项 
obj.add(new Option("文本","值")); 
}

3.删除所有选项option
function removeAll(){ 
var obj=document.getElementByIdx_x('mySelect'); 
obj.options.length=0; 
}

4.删除一个选项option
function removeOne(){ 
var obj=document.getElementByIdx_x('mySelect'); 
//index,要删除选项的序号,这里取当前选中选项的序号 
var index=obj.selectedIndex; 
obj.options.remove(index); 
}

5.获得选项option的值
var obj=document.getElementByIdx_x('mySelect'); 
var index=obj.selectedIndex; //序号,取当前选中选项的序号 
var val = obj.options[index].value;

6.获得选项option的文本
var obj=document.getElementByIdx_x('mySelect'); 
var index=obj.selectedIndex; //序号,取当前选中选项的序号 
var val = obj.options[index].text;

7.修改选项option
var obj=document.getElementByIdx_x('mySelect'); 
var index=obj.selectedIndex; //序号,取当前选中选项的序号 
var val = obj.options[index]=new Option("新文本","新值");

8.删除select
function removeSelect(){ 
var mySelect = document.getElementByIdx_x("mySelect"); 
mySelect.parentNode.removeChild(mySelect); 
}
Javascript 相关文章推荐
javascript 模式设计之工厂模式学习心得
Apr 27 Javascript
jquery实现图片滚动效果的简单实例
Nov 23 Javascript
node.js开机自启动脚本文件
Dec 24 Javascript
JavaScript原型及原型链终极详解
Jan 04 Javascript
JS中使用 after 伪类清除浮动实例
Mar 01 Javascript
angular仿支付宝密码框输入效果
Mar 25 Javascript
AngularJS遍历获取数组元素的方法示例
Nov 11 Javascript
Vue点击切换颜色的方法
Sep 13 Javascript
vue中引入mxGraph的步骤详解
May 17 Javascript
ES6 Promise对象概念及用法实例详解
Oct 15 Javascript
解决vue-loader加载不上的问题
Oct 21 Javascript
JavaScript 中判断变量是否为数字的示例代码
Oct 22 Javascript
jQuery实现单行文字间歇向上滚动源代码
Jun 02 #Javascript
js内存泄露的几种情况详细探讨
May 31 #Javascript
js判断鼠标同时离开两个div的思路及代码
May 31 #Javascript
Javacript实现颜色梯度变化和渐变的效果代码
May 31 #Javascript
js 输出内容到新窗口具体实现代码
May 31 #Javascript
chrome浏览器不支持onmouseleave事件的解决技巧
May 31 #Javascript
window.event.keyCode兼容IE和Firefox实现js代码
May 30 #Javascript
You might like
zf框架的Filter过滤器使用示例
2014/03/13 PHP
PHP读书笔记整理_结构语句详解
2016/07/01 PHP
Yii数据读取与跳转参数传递用法实例分析
2016/07/12 PHP
ecshop适应在PHP7的修改方法解决报错的实现
2016/11/01 PHP
关于 Laravel Redis 多个进程同时取队列问题详解
2017/12/25 PHP
JavaScript 设计模式学习 Singleton
2009/07/27 Javascript
Javascript 中的 && 和 || 使用小结
2010/04/25 Javascript
functional继承模式 摘自javascript:the good parts
2011/06/20 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(一)让静态人物动起来
2013/01/23 Javascript
JQuery实现展开关闭层的方法
2015/02/17 Javascript
JavaScript里实用的原生API汇总
2015/05/14 Javascript
jQuery实现动画效果circle实例
2015/08/06 Javascript
Vue.js实现文章评论和回复评论功能
2020/05/30 Javascript
CheckBox多选取值及判断CheckBox选中是否为空的实例
2017/10/31 Javascript
利用vue开发一个所谓的数独方法实例
2017/12/21 Javascript
JS实现字符串中去除指定子字符串方法分析
2018/05/17 Javascript
微信小程序 Animation实现图片旋转动画示例
2018/08/22 Javascript
vue指令v-html使用过滤器filters功能实例
2019/10/25 Javascript
[03:04]2018年国际邀请赛典藏宝瓶&莱恩声望物品展示 片尾有彩蛋
2018/06/04 DOTA
Python selenium如何设置等待时间
2016/09/15 Python
Django实战之用户认证(用户登录与注销)
2018/07/16 Python
python 实现矩阵上下/左右翻转,转置的示例
2019/01/23 Python
简单介绍django提供的加密算法
2019/12/18 Python
tensorflow 只恢复部分模型参数的实例
2020/01/06 Python
基于python+selenium的二次封装的实现
2020/01/06 Python
Python中断多重循环的几种方式详解
2020/02/10 Python
QML实现钟表效果
2020/06/02 Python
在加拿大在线租赁和购买电子游戏:Game Access
2019/09/02 全球购物
科长竞聘演讲稿
2014/05/16 职场文书
党政领导班子群众路线对照检查材料思想汇报
2014/09/27 职场文书
文艺有韵味的诗句(生命类、亲情类...)
2019/07/11 职场文书
选择比努力更重要?这是长期以来对“努力”的最大误解
2019/07/12 职场文书
Pytest实现setup和teardown的详细使用详解
2021/04/17 Python
详解JavaScript中Arguments对象用途
2021/08/30 Javascript
Pandas搭配lambda组合使用详解
2022/01/22 Python
python+pyhyper实现识别图片中的车牌号思路详解
2022/12/24 Python