Question

我在下面有一个jquery代码，从下拉菜单中删除了从下拉菜单中选择的选项：

            var selectedOption = jQuery("#modulesDrop option:selected");
            selectedOption.remove();

但在我执行删除之前，我想将下拉菜单中的内容添加到选择框中，但问题是我似乎不知道如何执行此操作。我尝试了下面的代码，但所有这些都是从上面的下拉菜单中删除选项，并没有将选项添加到选择框中：

        var selectedOption = jQuery("#modulesDrop option:selected");
        selectedOption.appendTo("#moduleExistForm");
        selectedOption.remove();

Answer 1

 var selectedOption = jQuery("#modulesDrop option:selected");
 var appendedObject = '<div>Something</div>';
 selectedOption.before(appendedObject);
 selectedOption.remove();

.append（）方法将指定的内容作为最后一个子项插入因此，如果您在方法之前或之后选择了对象。

Answer 2

摆脱.remove（）。通过使用appendTo（），您可以将该元素从当前位置移动到新位置。

如果您只想移动内容，请将值保存到变量中，然后将其追加。

var selectedOption = jQuery("#modulesDrop option:selected"),
    selectedOptionValue = selectedOption.val();
selectedOptionValue.appendTo("#moduleExistForm");
selectedOption.remove();

Answer 3

您无需调用remove()，因为appendTo()会自动将元素与其原始父级分离，然后将其附加到您指定的新元素上：

<select id="old">
<option value="dog">dog</option>
<option value="cat">cat</option>
</select>

<input type="button" value="add" id="add"/>

<select id="new">
</select>
<script>
   $('#add').click(function(){
     var x = $('#old option:selected');
     x.appendTo($('#new'))
    });
</script>

这是小提琴： http://jsfiddle.net/8MAny/

如何从下拉菜单中将选项添加到选择框中？

3 个答案: