博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js操作select和option
阅读量:7094 次
发布时间:2019-06-28

本文共 1656 字,大约阅读时间需要 5 分钟。

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("文本","值"));    //这个只能在IE中有效          obj.options.add(new Option("text","value")); //这个兼容IE与firefox}

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);}

整个实例的完整代码如下:

      

改进版:在select中添加、修改、删除option元素

function watch_ini(){ // 初始     for(var i=0; i

整个实例的完整代码如下:

   javascript select options text value 

用一个字符串创建一个数组方法:

 

转载地址:http://pxxql.baihongyu.com/

你可能感兴趣的文章
less引用其他less文件
查看>>
SQL Server Profiler – 存储过程调试
查看>>
在远程计算机运行PowerShell命令
查看>>
勤快的love枫[ZJOI2007]
查看>>
Linux查看系统信息的一些命令及查看已安装软件包的命令
查看>>
poj1417 true liars(并查集 + DP)详解
查看>>
离散数学--二元关系总结
查看>>
HTML5 本地存储 localStorage、sessionStorage 的遍历、存储大小限制处理
查看>>
【leetcode】688. Knight Probability in Chessboard
查看>>
【leetcode】Maximum Product of Word Lengths
查看>>
C 工具库 GLib --- 提供多种高级的数据结构,如内存块、双向和单向链表、哈希表、动态字符串等...
查看>>
SQL中format()函数对应的格式
查看>>
svn command
查看>>
职业插画之路
查看>>
Java入门篇(五)——字符串/String类
查看>>
python 的StringIO
查看>>
第三个阶段事后诸葛亮
查看>>
java中的sql语句中如果有like怎么写
查看>>
【原创】驱动加载之StartService
查看>>
1751: [Usaco2005 qua]Lake Counting
查看>>