包含jquery清空select的词条

jquery 如何去除select 控件重复的option

这个问题最好应该在后台中处理掉——创建select元素之前就过滤掉重复的元素。如果必须要在页面中处理，方法也比较多，这里提供一个使用jquery选择器 :contains 的方法：

$(":contains(text)");  // 选取包含指定字符串的元素

这样就可以选出包含重复字符串的option元素，然后将其删掉

示例代码如下

创建Html元素

div class="box"

span点击按钮删除select控件中的重复元素：/spanbr

div class="content"

select 

option1/option

option1/option

option2/option

option2/option

option3/option

/select

/div

input type="button" value="删除重复项"

/div

设置css样式

div.box{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}

div.box span{color:#999;font-style:italic;}

div.content{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}

select{width:150px;height:30px;margin:5px 0;border:1px solid #6699FF;}

input[type='button']{height:30px;margin:10px;padding:5px 10px;}

编写jquery代码

$(function(){

$(":button").click(function() {

$("select option").each(function() {

text = $(this).text();

if($("select option:contains("+text+")").length  1)

$("select option:contains("+text+"):gt(0)").remove();

});

});

})

观察效果

初始状态

点击按钮删除重复项之后

相关问答

Q1: jquery select 用empty()方法 清空option

清空option 不是很难的操作。只需要遍历现有option，将其每个子元素都置空即可。

代码如下：

function clearOption(selectId){

var selectObj = document.getElementById(selectId);

for(var i = 0,len = selectObj.options.length; i len; i++){

selectObj.options[0] = null;

}

}

Q2: jquery如何删除select中全部option项

jQuery获取Select选择的Text和Value:

1. var checkText=jQuery("#select_id").find("option:selected").text(); //获取Select选择的Text

2. var checkValue=jQuery("#select_id").val(); //获取Select选择的option Value

3. var checkIndex=jQuery("#select_id ").get(0).selectedIndex; //获取Select选择的索引值

4. var maxIndex=jQuery("#select_id option:last").attr("index"); //获取Select最大的索引值

jQuery添加/删除Select的Option项：

1. jQuery("#select_id").append("option value='Value'Text/option"); //为Select追加一个Option(下拉项)

2. jQuery("#select_id").prepend("option value='0'请选择/option"); //为Select插入一个Option(第一个位置)

3. jQuery("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个)

4. jQuery("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个)

5. jQuery("#select_id option[value='3']").remove(); //删除Select中Value='3'的Option

6. jQuery("#select_id option[text='4']").remove(); //删除Select中Text='4'的Option

内容清空：

jQuery("#select_id").empty();

Q3: 如何使用jquery清除select中的所有option？

select中所有option选项如何删除，本文使用jquery简单实现下，有此需求的朋友可以参考下，希望对大家有所帮助

这样写

复制代码代码如下:

select id="search"

optionbaidu/option

optionsogou/option

/select

清空：

复制代码代码如下:

$("#search").find("option").remove();

或者

$("#search").empty();

Q4: 如何用jquery选中select的第二个option

方法步骤如下：

1、首先打开计算机，然后打开前端编辑软件，新建一个html文件。

2、在html代码页面新建标签，再在界面内输入如下代码：input type="button" value="清空" onclick="clearSelect();"/  div id="test"   select name=""    option value="0"请选择下拉菜单/option    option value="1"选择1/option    option value="2"选择2/option    option value="3"选择3/option   /select  /div。

3、然后再在界面内添加点击事件并输入如下代码： script   function clearSelect(){    $("#test select").each(function(){     $(this).find("option").eq(0).prop("selected",true)    })   }  /script。

4、保存html文件后使用浏览器打开，会出现选择select下拉菜单。

5、然后选择第二个选项即可。

Q5: jquery multiSelect 怎么清空选择

multiSelect 是一个jquery多选框或单选框美化工具，并且附带js的查询功能，是一个非常好用的jquery插件，使用此插件需要引用jquery。

//清空单选框的选择代码是：

$('select.singleselect').multiselect('clearSelection');

$('select.singleselect').multiselect('refresh');

//清空多选框选中代码：

$('select[multiple="multiple"]').multiselect('clearSelection');

$('select[multiple="multiple"]').multiselect('refresh');