原文地址: http://www.php100.com/html/program/jquery/2013/0905/5931.html
本文章总结了关于jquery与javascript中对select下拉框的常用操作实现代码,有需要了解的朋友可进入参考参考。
js 操作select和option
1.动态创建select
代码如下 | 复制代码 |
function createSelect(){ var mySelect = document.createElement_x("select"); |
2.添加选项option
代码如下 | 复制代码 |
function addOption(){ //根据id查找对象, //添加一个选项 |
3.删除所有选项option
代码如下 | 复制代码 |
function removeAll(){ } |
4.删除一个选项option
代码如下 | 复制代码 |
function removeOne(){ //index,要删除选项的序号,这里取当前选中选项的序号 var index=obj.selectedIndex; |
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(){ |
下面再发上<a href="http://www.php100.com/tags.php/%3Ca%20href=" list-139="" "="" target="_blank" style="color: rgb(17, 172, 255); text-decoration: none;">jquery+select/" target="_blank">jquery select操作吧
语法解释:
代码如下 | 复制代码 |
1. $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 |
jQuery设置Select选择的Text和Value:
语法解释:
代码如下 | 复制代码 |
1. $("#select_id ").get(0).selectedIndex=1; //设置Select索引值为1的项选中 2. $("#select_id ").val(4); //设置Select的Value值为4的项选中 3. $("#select_id option[text='jQuery']").attr("selected", true); //设置Select的Text值为jQuery的项选中 |
jQuery添加/删除Select的Option项:
语法解释:
代码如下 | 复制代码 |
1. $("#select_id").append("Text"); //为Select追加一个Option(下拉项) 2. $("#select_id").prepend("请选择"); //为Select插入一个Option(第一个位置) 3. $("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个) 4. $("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个) 5. $("#select_id option[value='3']").remove(); //删除Select中Value='3'的Option 5. $("#select_id option[text='4']").remove(); //删除Select中Text='4'的Option |