Question

我想实现以下功能。

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

我可以删除部分并部分附加部分。（需要在其原始位置附加前一个值。）

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/

Answer 1

请在下次简化您的问题，是否要隐藏其他<option>中的所选<select>？

希望这个帮助，http://jsfiddle.net/GG3S5/9/

如何在另一个下拉列表的更改事件的下拉列表中删除和附加值

1 个答案: