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 ...
随机推荐
- JavaScript中继承的实现
继承是类和类之间的关系,继承使得子类别具有父类别的属性和方法. js里常用的如下两种继承方式: 原型链继承(对象间的继承) 类式继承(构造函数间的继承) 由于js不像java那样是真正面向对象的语言, ...
- 【51nod】1227 平均最小公倍数
题解 这个故事告诉们数论函数不要往分式上跑,你推不出来 好久没推式子了这么明显的转化我都忘了= = 首先\(A(n) = \frac{1}{n} \sum_{i = 1}^{n} \frac{i * ...
- Github 中提交项目到自己仓库的 gh-pages 分支
Github 中提交项目到自己仓库的gh-pages分支 cd cnblogs-theme/ git init git remote add origin git@github.com:hglibin ...
- VideoView视频缓冲进度条
效果图: 需求: 刚进入视频播放页时,屏幕中间有加载进度条 视频播放过程中,视频界面不动了,正在缓冲时,屏幕中间有加载进度条 private ObjectAnimator rotate; ImageV ...
- Wannafly挑战赛7 C - 小Q与氪金游戏
题目描述 “为世界上所有的美好而战!”小Q同学最近沉迷“稳固3”,为了从最新的蛋池中抽出自己喜欢的角色卡,不惜氪下重金.在这个游戏中,氪一单可以得到x个宝石,而抽一次卡需要花费y个宝石,由于游戏策划十 ...
- hp
命令组成hpacucli [parameter=value] 查看: 查看所有控制器状态 hpacucli ctrl all show 查看slot 0阵列信息详细状态 (可以查看物理磁盘和逻辑磁盘的 ...
- Highcharts实现走势图
Highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表,并且免费提供给个人学习.个人网站和非商业用途使用.HighCh ...
- Elasticsearch 删除索引下的所有数据
下面是head中操作的截图 #清空索引 POST quality_control/my_type/_delete_by_query?refresh&slices=5&pretty { ...
- 阿里云提示Discuz memcache+ssrf GETSHELL漏洞如何解决
一般这个漏洞都是下面文件,source/function/function_core.php 搜索下面代码: $content = preg_replace($_G['setting']['outpu ...
- sublime text3 常用插件
1.代码格式化:html-css-js prettify 2.代码注释:docBlockr 3.代码管理:git.gitGutter 4.快速编辑:emmet 5.代码匹配:bracket highl ...