js 操作select和option常用代码整理
1、获取选中select的value和text,html代码如下:
<select id="mySelect">
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
</select>
$("#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);
}
js 操作select和option常用代码整理的更多相关文章
- js 操作select和option
js 操作select和option 1.动态创建select function createSelect(){ var mySelect = document.createElement_x(&qu ...
- js 操作select和option常见用法
1.获取选中select的value和text,html <select id="mySelect"> <option value="1"&g ...
- js操作select和option
1.动态创建select function createSelect(){ var mySelect = document.createElement_x("select"); m ...
- Js操作Select大全(取值、设置选中)
Js操作Select是很常见的,也是比较实用的. jquery操作select(取值,设置选中) 每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如<s ...
- Js操作Select
jquery操作select(取值,设置选中) 每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如<select class="selecto ...
- JS操作select标签
主要利用这个来实现省市区三级联动的 我利用的是ajax,每一次onchange事件都改变相对应的select中的option,数据全是ajax请求服务器查询数据库而来的,效果还可以,在本地测试的时候速 ...
- Js操作Select大全(取值、设置选中等等)
jquery操作select(取值,设置选中) 每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如<select class="selecto ...
- js操作select控件大全(包含新增、修改、删除、选中、清空、判断存在等)
原文:js操作select控件大全(包含新增.修改.删除.选中.清空.判断存在等) js操作select控件大全(包含新增.修改.删除.选中.清空.判断存在等) js 代码// 1.判断select选 ...
- IOS常用代码整理
常用代码整理: 12.判断邮箱格式是否正确的代码: //利用正则表达式验证 -(BOOL)isValidateEmail:(NSString *)email { NSString *emailRege ...
随机推荐
- Windows内核进程管理器解析
Windows内核是如何实现线程挂起的?如何实现线程挂载到进程的?如何实现杀死进程和线程的? 从源码分析一下,这些操作具体在源码上是如何实现的. 进程创建.线程切换.线程跨越CPU权限级.进程挂靠.杀 ...
- jquery datatable的详细用法
1,首先需要引用下面两个文件 <link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css ...
- git的使用总结【干货·转载】
源文地址:https://juejin.im/post/5a54386af265da3e3b7a6317 摘抄: 版本树 / graph / network 干净简洁清晰 提交信息明确 易维护易读 举 ...
- css3实现立方体,并且自转效果
先是HTML 一个父div包含四个绝对定位的div <div class='container container--realistic'> <div class='cube cub ...
- STL容器 -- Bitset
核心内容:Bitset 是 STL 中的二进制容器, 存放的时 bit 位元素, 每一位只占一个 bit 位, 取值 0 或者 1, 可以像整形元素一样按位与或非, 并且大大优化了时间和空间复杂度. ...
- hihocoder #1580 : Matrix (DP)
#1580 : Matrix 时间限制:1000ms 单点时限:1000ms 内存限制:256MB 描述 Once upon a time, there was a little dog YK. On ...
- 【BZOJ 2299】 2299: [HAOI2011]向量 (乱搞)
2299: [HAOI2011]向量 Time Limit: 10 Sec Memory Limit: 256 MBSubmit: 1255 Solved: 575 Description 给你一 ...
- 【BZOJ 2039】 2039: [2009国家集训队]employ人员雇佣 (最小割)
2039: [2009国家集训队]employ人员雇佣 Time Limit: 20 Sec Memory Limit: 259 MBSubmit: 1511 Solved: 728 Descri ...
- 【UOJ 117】欧拉回路
#117. 欧拉回路 有一天一位灵魂画师画了一张图,现在要你找出欧拉回路,即在图中找一个环使得每条边都在环上出现恰好一次. 一共两个子任务: 这张图是无向图.(50分) 输入格式 第一行一个整数 t, ...
- codevs 5294 挖地雷
5294 挖地雷 时间限制: 1 s 空间限制: 1000 KB 题目等级 : 黄金 Gold 题目描述 Description 在一个地图上有N个地窖(N<=20),每个地窖中埋有一 ...