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

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

1、获取选中select的value和text,html

通过以下script代码s来获取选中的value和text

$("#mySelect").val(); //获取选中记录的value值$("#mySelect option:selected").text(); //获取选中记录的text值

2、运用new Option("文本","值")方法添加选项option

var obj = document.getElementById("mySelect");obj.add(new Option("4","4"));

3、删除所有选项option

var obj = document.getElementById("mySelect");obj.options.length = 0;

4、删除选中选项option

var obj = document.getElementById("mySelect");var index = obj.selectedIndex;obj.options.remove(index);

5、修改选中选项option

var obj = document.getElementById("mySelect");var index = obj.selectedIndex;obj.options[index] = new Option("three",3); //更改对应的值obj.options[index].selected = true; //保持选中状态

6、删除select

var obj = document.getElementById("mySelect");obj.parentNode.removeChild(obj); //移除当前对象

7、select选择的响应事件

$("#mySelect").change(function(){ //添加所需要执行的操作代码})

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

 

转载于:https://www.cnblogs.com/yuer20180726/p/11196488.html

你可能感兴趣的文章
[HDU] 1068 Girls and Boys(二分图最大匹配)
查看>>
ADO.NET类的模型关系图
查看>>
SRM 604 DIV2 250
查看>>
python中异常处理之esle,except,else
查看>>
看苹果官方API
查看>>
06-基础-系统指令-v-model-语法糖原理
查看>>
论文网站相关链接
查看>>
ipad4自动下载了ios8的安装包,好几个G啊,不想更新,怎么删了呢?
查看>>
JS中的Navigator 对象
查看>>
Android 开源控件与常用开发框架开发工具类
查看>>
记录一次网站打开卡--排故障过程
查看>>
第四章小结
查看>>
Windows7下python2.7.6环境变量配置
查看>>
java设计模式------代理模式
查看>>
WPF学习笔记----注释标记,使用自定义资源字典(style)文件的流程
查看>>
元素定位的八大法则
查看>>
Sublime Text 3 使用小记
查看>>
总结Pycharm里面常用的快捷键
查看>>
util.promisify 的那些事儿
查看>>
配置phpstudy+phpstorm+xdebug环境
查看>>