Question

我正在尝试将dropdown从one复制到another，但是当它appends时，它会从options中移除previous one 。为什么呢？

我的代码是：

HTML：

<select id="dropdown" multiple="multiple">
  <option value="1">Opt 1</option>
  <option value="2">Opt 2</option>
  <option value="3">Opt 3</option>
</select>
<select id="options2"></select>

SCRIPT：

$(document).ready(function(){
    $('#dropdown').on('change',function(){
        $("#dropdown option:selected").each(function(){
            $("#options2").append($(this));            
        });
    });    
});

小提琴 http://jsfiddle.net/5BU4T/

Answer 1

获取元素的克隆，然后追加。

$("#options2").append($(this).clone());

Answer 2

尝试

$("#options2").append("<option value='"+$(this).html()+"'>"+$(this).html()+"</option>");

Answer 3

使用.clone()并记住忽略重复项。

 $(document).ready(function(){
    $('#dropdown').on('change',function(){
        $("#dropdown option:selected").each(function(){
            var vThis = $(this);
            // check if already added in the dropdown, dont append again
            var toAppend = true;
            $('#options2 option').each(function(){
                    if($(this).val() == vThis.val())
                    {
                        toAppend = false;
                        return;
                    }
            });

            if(toAppend == true)
                $("#options2").append(vThis.clone());     
        });
    });    
});

Answer 4

试试这个：

$(document).ready(function(){
    $('#dropdown').on('change',function(){
        $("#dropdown option:selected").each(function(){
            if(!$("#options2 option[value="+$(this).val()+"]").length)
            //to remove redundancy
               $("#options2").append($(this).clone());            
        });
    });    
});

Jquery选择选项复制产生不同的输出

4 个答案: