jquery操作select option 的代码小结
更新时间:2011年06月21日 23:28:18 作者:
jquery操作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>
则可通过以下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(){
//添加所需要执行的操作代码
})
复制代码 代码如下:
<select id="mySelect">
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
</select>
则可通过以下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(){
//添加所需要执行的操作代码
})
您可能感兴趣的文章:
- jquery操作select详解(取值,设置选中)
- jquery实现动态操作select选中
- jQuery操作select下拉框的text值和value值的方法
- 利用jquery操作select下拉列表框的代码
- jQuery操作Select的Option上下移动及移除添加等等
- jQuery操作Select选择的Text和Value(获取/设置/添加/删除)
- jquery操作select大全
- jQuery操作select的实例代码
- jquery操作select元素和option的实例代码
- jquery下拉select控件操作方法分享(jquery操作select)
- jquery操作select常见方法大全【7种情况】
相关文章
jquery 将disabled的元素置为enabled的三种方法
在jquery中可以通过jqueryObj.attr("disabled","disabled")将页面中某个元素置为不可编辑或触发状态,但是在jquery的API reference中并没说明怎么将页面置为disable的元素重新置为可触发或可编辑的。2009-07-07
jquery ui 1.7 ui.tabs 动态添加与关闭(按钮关闭+双击关闭)
jquery ui 1.7 ui.tabs 动态添加与关闭(按钮关闭+双击关闭)实现代码,需要的朋友可以参考下。2010-04-04
jQuery UI工具提示框部件Tooltip Widget
这篇文章介绍了jQuery UI工具提示框部件Tooltip Widget,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2022-06-06
jquery实现隐藏与显示动画效果/输入框字符动态递减/导航按钮切换
jquery实现隐藏显示层动画效果、仿新浪字符动态输入、tab效果等等,以下为所有代码,感兴趣的朋友可以练练手哈,希望对大家学习有所帮助2013-07-07


最新评论