通過點擊按鈕添加新的<select>標籤

我有一個「添加語句」按鈕，每次點擊按鈕（不刷新頁面）後，我需要一個<select>標籤出現在我的頁面上。以下是Select的代碼：通過點擊按鈕添加新的<select>標籤

<select id = "statement" name = "statement"> 
<?php 

    $select = "SELECT name FROM Statements"; 
    $res = $conn->query($select); 
    while($row = $res->fetch_assoc()){ 
     echo "<option value=\"" . $row['name'] . "\">" . $row['name'] . "</option>"; 
    } 

?> 
</select>

我該怎麼做？

來源

2015-12-26 user5718409

選擇新選項還是新選項？ – CoderPi

@CodeiSir一個新的選擇。 – user5718409

用什麼內容？它的副本？ – CoderPi

使用ELEMENT.cloneNode(true)克隆的元素，並true也克隆子節點：

var selectionCounter = 0 
 
function cloneSelect() { 
 
    var select = document.getElementById("statement") 
 
    var clone = select.cloneNode(true) 
 
    var name = select.getAttribute("name") + selectionCounter++ 
 
    clone.id = name 
 
    clone.setAttribute("name", name) 
 
    document.getElementById("selectContainer").appendChild(clone) 
 
}

<div id="selectContainer"> 
 
    <select id="statement" name="statement"> 
 
    <option value="1">Option 1</option> 
 
    <option value="2">Option 2</option> 
 
    <option value="3">Option 3</option> 
 
    </select> 
 
</div> 
 

 
<button onclick="cloneSelect()">Add another Select</button>

更多信息有關node.cloneNode(deep)這裏：https://developer.mozilla.org/en/docs/Web/API/Node/cloneNode

來源

2015-12-26 12:01:47 CoderPi

非常感謝。但我想我還需要改變從「聲明」到「statement_n」選擇的名字，這樣我就可以得到所選擇的選項值，不是嗎？ – user5718409

我添加了這樣做的代碼，新的將被命名爲「statement0」，「statement1」，... – CoderPi

@ user5718409它現在對你有用嗎？你需要更多幫助嗎？ – CoderPi

-1

我認爲這將幫助你 -

<script> 
    function addOption(){ 
    var sel = document.getElementById("statement"); 
    var option = document.createElement("option"); 
    option.innerHTML = "name"; 
    option.value = "1"; 
    sel.appendChild(option); 
} 
</script>

來源

2015-12-26 13:24:47

「的新選擇或選擇一個新的選項 - CodeiSir 1小時前」 \t \t \t 「@CodeiSir一個新的選擇 - user5718409」 – CoderPi

一個新的選項將在選擇內部創建。 –

他想要一個新的選擇並不是一個新的選項 – CoderPi

-1

試試這個。它可能會幫助你。

<!DOCTYPE html> 
<html> 
<head></head> 

<body> 
<div id="container"></div> 
<button type="button" id="add" onclick="addOption()">Add a statement</button> 

<?php 

$que = mysql_query("SELECT name FROM Statements") or die(mysql_error()); 

$script = "<script>function addOption(){"; 
$script .= "var container = document.getElementById('container');"; 
$script .= "var select = document.createElement('select');"; 
while($data = mysql_fetch_array($que)){ 
$script .= "var option = document.createElement('option');"; 
    $script .= "option.innerHTML = '$data[0]';"; 
    $script .= "select.appendChild(option);"; 
} 
$script .= "container.appendChild(select);"; 
$script .= "}</script>"; 
echo $script; 
?> 



</body> 

</html>

來源

2015-12-26 15:39:40

通過點擊按鈕添加新的<select>標籤

回答

相關問題