Question

摘要：我有一个填充了MySQL条目的选择列表。现在我想复制列表和条目＆＃34; onclick＆＃34;。如何将列表及其条目复制？

我有什么

<select name="acclist" id="acclist" class="acc_list">
<option value="">Select Country</option>
  <?php       
    $sql1="SELECT * FROM accounts";
        $results=$con->query($sql1); 
    while($rs=$results->fetch_assoc()) { 
    ?>
    <option value="<?php echo $rs["number"]; ?>"><?php echo $rs["name"]; ?></option>
    <?php
    }
  ?>
</select>

这是使用MySQL-table中的选项填充select-tag的代码。

我想做什么 点击一个用户应该得到另一个选择，另一个点击另一个选择，依此类推。每个选择应该等于我已经拥有的选择。因此，不仅要复制select-tag，还要复制表中值的选项。

问题如何复制填充了MySQL条目的select元素？

我尝试使用JS，但我只获得了一行。

function populate(selector) {
  $(selector)
    .append('<option value="<?echo $row0[1]; ?>"><? echo $row0[2]; ?></option>')
//    .append('<option value="bar">bar</option>')
}

populate('.myselect');

有没有其他方法可以解决它或我犯的错误在哪里？

提前致谢。

Answer 1

您只需克隆select节点并将deep参数设置为true，以便克隆其内容。然后，您只需将克隆添加到表单中即可：

<强>代码：

var
   node = document.getElementById("acclist"),
   clone = node.cloneNode(true);

/* Insert the node to the DOM. */
node.parentNode.appendChild(clone);

<强>段：

/* -- JavaScript -- */
function duplicate () {
  var
    node = document.getElementById("acclist"),
    clone = node.cloneNode(true);

  /* Insert the node to the DOM. */
  node.parentNode.appendChild(clone);
}


/* Add the event listener to the 'click' event of the button. */
document.getElementById("duplicate").addEventListener("click", duplicate);

<!-- HTML -->
<button id = "duplicate">Duplicate</button>
<select name="acclist" id="acclist" class="acc_list">
  <option value="">Select Country</option>
  <option value="1">Country 1</option>
  <option value="2">Country 2</option>
  <option value="3">Country 3</option>
</select>

注意：

可能附加到原始select的事件侦听器不会转移到克隆元素。在这种情况下，您必须使用事件委派（适用于JavaScript＆amp; jQuery）。
克隆元素时请注意重复的ID。

如何复制MySQL填充的选择元素？

1 个答案: