如何在jQuery中单击按钮后添加新的选择框

Question

我不知道是否有可能使用jquery ..我有一个选择选项，它具有来自数据库的数据数组，而我想要的是每当我单击一个按钮时，另一个选择选项就会像第一个选择选项一样弹出。是我选择选项的代码

  <select class="form-control" name="room[]" id="room[]"> <option value="" default>Select</option> <?php $room = $subjectsClass->room(); foreach ($room as $key => $value) { echo '<option value=" ' . $value['room_id'] .' ">' . $value['room_no'] . '</option>'; } ?> </select> <button type="button" class="btn btn-default" id="addRooms" >Add more Rooms?</button> <script> $('#addRooms').click(function(){ //append another select box with data from database,..how?? }); </script> 

Answer 1

假设您已将其包装到div中，例如：

<div id="the_div_of_wrapping"> all your stuff </div>

然后我会做：

var the_select = $("#room[]");
var the_id = the_select.prop("id");
var the_number_of_selects = $("select").length;
var the_div_of_wrapping = $("#the_div_of_wrapping");

the_select.clone().prop("id", the_id + the_number_of_selects);
the_div_of_wrapping.append(the_select);

。

更新：

如评论中所述，我将删除id，因为它是不必要的，然后代码将是：

var the_select = $("#room[]");
var the_div_of_wrapping = $("#the_div_of_wrapping");

the_select.clone();
the_div_of_wrapping.append(the_select);