JavaScript下拉框去除重复内容

下拉框去除重复内容

<script type="text/javascript" src="http://www.joleye.com/libraries/javascript/jquery-1.5.1.min.js"></script>
<a href="###">加载</a>
<select>
</select>

<a href="###">加载</a>
<select>
</select>

<a href="###">加载</a>
<select>
</select>

<a href="###">加载</a>
<select>
</select>

<a href="###">加载</a>
<select>
</select>

<a href="###">加载</a>
<select>
</select>

<script>
var option = [
    {
        value : ‘‘,
        text : ‘--请选择--‘
    },
    {
        value : ‘1‘,
        text : ‘java‘
    },
    {
        value : ‘2‘,
        text : ‘.net‘
    },
    {
        value : ‘3‘,
        text : ‘python‘
    }
];

$(‘a‘).click(function(){

    var t = $(this).next();

    if(t.val()!=null){
        t.empty();
    }

    var tar = {};

    $(‘select option:selected‘).each(function(){
        if($(this).val() != ‘‘)
            tar[$(this).val()] = 1;
    });

    var newoption = [];
    $.each(option,function(i,val){
        if(!tar[val.value]){
            newoption.push(val);
        }
    });

    $.each(newoption,function(i,val){
        $(‘<option value="‘+val.value+‘">‘+val.text+‘</option>‘).appendTo(t);
    });

});
</script>

演示地址:http://jsfiddle.net/joleye/cxzxm8so/

时间: 2024-10-27 12:41:03

JavaScript下拉框去除重复内容的相关文章

JavaScript解决select下拉框中的内容太长显示不全的问题

JavaScript解决select下拉框中的内容太长显示不全的问题 1.说明 有些情况下,select下拉框的内容过长,导致部分看不见: 现在通过鼠标事件,让下拉框中的内容显示完全 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html

关于java 获取 html select标签 下拉框 option 文本内容 隐藏域

在HTML中从多选下拉框中提取已选中选项的文本内容到后台,被这个问题难倒了. demo.jsp文件 <select id="selecttype" name"type"> <option value="" selected="selected">请选择</option> <c:forEach items="${typeList}" var="typeLis

左右两个下拉框里的内容互换

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <select id="left_slt" size="7" multiple="multiple" style="width: 150px;&quo

添加和移除下拉框的的内容

============html============= <div class="demo1"> <div> <div class="mb10"> <input type="text" name="" id="txt"/><a id="add" href="javascript:;">添加</a>

jQuery插件实现select下拉框左右选择_交换内容(multiselect2side)

效果图: 使用jQuery插件---multiselect2side做法: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head&

select下拉框左右变换

效果图: 使用jQuery插件---multiselect2side做法: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww

下拉框插件的详解

本插件是基于jQuery实现的 function DropSelect(obj){ obj = obj || {}; var p = this; p.id = obj.id || 'selectDrop'; //这个id为页面上的元素的id,一般为添加下拉框的div元素 p.data = obj.data || []; //传入此下拉框插件的数据是一个数组形式的对象[{text: '', value: ''},{text: '', value: ''}],每一项就是下拉框的每一行(每一选项) i

android中自定义下拉框(转)

android自带的下拉框好用不?我觉得有时候好用,有时候难有,项目规定这样的效果,自带的控件实现不了,那么只有我们自己来老老实实滴写一个新的了,其实最基本的下拉框就像一些资料填写时,点击的时候出现在编辑框的下面,然后又很多选项的下拉框,可是我在网上找了一下,没有这种下拉框额,就自己写了一个,看效果图先: ,这个是资料填写的一部分界面,三个下拉框,选择故乡所在地: 点击之后弹出下拉框,选择下面的选项: 三个下拉框时关联的,第一个决定了第二数据内容,第二个决定了第三个数据内容,如果三个全部选好之后

ASP.NET——实现两个下拉框动态联动

引入: 在网页中,我们经常会遇到下图中的情况.首先在下拉框中选择所在的省,选择之后,第二个下拉框会自动加载出该省中的市.这样设计极大的方便了用户的查找.那这是如何实现的呢? 1.建立数据库 "省"表 "市"表 2.添加控件 3.两个下拉框分别绑定数据源 protected void Page_Load(object sender, EventArgs e) { //判断是否第一次进入页面,如果是,则绑定数据库:如果不是,则无需绑定. if (!this.IsPost