0

我想知道如何将选择框中的选项附加到另一个选择框中。但问题是我想附加选择框中的所有学生而不关心是否选择了该选项,如果学生在选择框中,那么他们应该被附加到另一个选择框中。

下面是我拥有的 jquery 代码,它应该执行附加但目前没有发生:

var selectedStudents = jQuery("select#studentadd").find("option");
selectedStudents.appendTo($("select#studentexist"));

下面是选择框#studentadd

<select multiple="multiple" name="addtextarea" id="studentadd" size="10">
    <option value='1'>u08743 - Joe Cann</option>
    <option value='4'>u03043 - Jill Sanderson</option>
    <option value='7'>u08343 - Craig Moon</option>
</select>

以下是学生应附加到的选择框:

<select id="studentexist" name="existtextarea"></select>
4

6 回答 6

1

试试这个代码...

    var str="";
        $('#studentadd').find('option').each(function(){
        str+="<option>"+$(this).html()+"</option>";
        });
$('#studentadd').html("");
        $('#studentexist').html(str);
于 2013-01-11T11:47:58.837 回答
1

它应该工作,也许你忘了这个

$(document).ready(function(){
  var selectedStudents = jQuery("select#studentadd").find("option");
            selectedStudents.appendTo($("select#studentexist"));
});
于 2013-01-11T11:48:10.150 回答
1

您可以使用jquery $.html()来执行此操作

var opt = $("#studentadd").html();
$("#studentexist").html(opt);

更新:

使用$.detach()移动 DOM

var opt = $("#studentadd").detach();
$("#studentexist").html(opt);
于 2013-01-11T11:48:45.650 回答
0

实际上,您的代码完美无缺,但是它将选项从第一个选择移到了第二个。如果你想复制它们,你需要添加一个.clone()这里是一个小提琴):

var selectedStudents = jQuery("select#studentadd").find("option");
selectedStudents.clone().appendTo($("select#studentexist"));
于 2013-01-11T11:50:42.323 回答
0

你可以试试这个

$("select#studentadd option").each(function(){
    $("select#studentexist").append($(this).clone());
});

例子

更新:(而不是副本)

$("select#studentadd option").each(function(){
    $("select#studentexist").append($(this));
});

例子

于 2013-01-11T11:53:21.160 回答
0

使用.clone():http: //jsbin.com/ucozis/4/edit

$(function(){

    $('#studentexist').html($('#studentadd option').clone());
    $('#studentadd').html('');

});

就在选择之后.append().clone()空白。

正如您提到的场景,这是对此的更新答案:

$(function(){
  $('button').click(function(){
    $('#studentexist').html($('#studentadd option').clone());
    $('#studentadd').html('');
  });
});

这是小提琴,它会在单击按钮 http://jsbin.com/ucozis/5/edit时替换所有内容

于 2013-01-11T11:53:57.267 回答