0

我想实现以下功能。

将有“n”个“选择”标签,并且在选择值(在更改事件时)时,所选值将从其他“选择”标签中删除。如果用户再次更改当前选定下拉列表中的值,我想在其原始位置的其他“选择”标签中添加先前选定的值。

我能够删除部分并部分附加部分。(需要在其原始位置附加先前的值。)

HTML:
<div class="container">
    <input id="preval" class="hidden" type="text" value="" name=""/>
    <select class="selectoption">
        <option value="1">1</option>
        <option value="ab">ab</option>
        <option value="xysd">xysd</option>
        <option value="4">4</option>                
    </select>
</div>
<div class="container">
    <select class="selectoption">
        <option value="1">1</option>
        <option value="ab">ab</option>
        <option value="xysd">xysd</option>
        <option value="4">4</option>                
    </select>
</div>
<div class="container">
    <select class="selectoption">
        <option value="1">1</option>
        <option value="ab">ab</option>
        <option value="xysd">xysd</option>
        <option value="4">4</option>                
    </select>
</div>

CSS:

.hidden{
    display:none;
}

JAVASCRIPT:
$(document).ready(function(){

    $(".selectoption").change(function(e){
                var currentvalue = $(e.currentTarget).val();    
    /*to remove selected option from other drop down list  */ $('.selectoption').not($(e.currentTarget)).children('option[value='+currentvalue+']').remove();
            var currindex = $(e.currentTarget).index();
            var prevval = $('#preval').val();       
            var previndex = $('#preval').attr("name");

        $('#preval').val(currentvalue);
        $('#preval').attr('name',previndex);
        /*apped previous value */
        if(previndex == currindex){
                    $('.selectoption').not($(e.currentTarget)).append('<option value='+prevval+'>'+prevval+'</option>');                    
                }
    });        
});


JSFiddle:
http://jsfiddle.net/GG3S5/1/
4

1 回答 1

1

Please simplify your question next time, do you want to hide the selected <option> in other <select>?

Hope this help, http://jsfiddle.net/GG3S5/9/

于 2013-04-07T08:37:54.353 回答