我正在创建一个订单，我正在进行新的编程。其思想是，客户可以添加新的盒子，以订购一个新的产品与数量。使用这段代码，我可以创建一个包含产品的框，但我没有在产品框旁边放一个数量框。我想为产品创建一个，为数量创建另一个，当客户单击New Product时，创建一个New Product列表和数量列表或数量字段以输入值。我试着复制了文件。创建...并更改div,但我不知道如何指向另一个选择。如果你们能帮我-我很感激。谢谢.
JavaScript
var choices = [
"Product1",
"Product2",
"Product3"];
function addInput(divName) {
var newDiv = document.createElement('div');
var selectHTML = "";
selectHTML="<select>";
for(i = 0; i < choices.length; i = i + 1) {
selectHTML += "<option value='" + choices[i] + "'>" + choices[i] + "</option>";}
selectHTML += "</select>";
newDiv.innerHTML = selectHTML;
document.getElementById(divName).appendChild(newDiv);
var Div = document.createElement('div');
var selectHTML = "";
selectHTML="<select>";
for(i = 0; i < choices.length; i = i + 1) {
selectHTML += "<option value='" + choices[i] + "'>" + choices[i] + "</option>";}
selectHTML += "</select>";
Div.innerHTML = selectHTML;
document.getElementById(divName).appendChild(Div);
HTML
<form class="new" method="post" action="phppage">
<fieldset id="products"> <legend> PRODUCTS </legend>
<select name="tProduct" id="cProduct">
<optgroup label="GALLON BAG">
<option>Product1</option>
<option>Product2</option>
<option>Product3</option>
</optgroup>
</select>
<label for="cQuantity">Quantity:<span style="color:red">*</span></label> <input type="number" name="tQuantity" id="cQuantity" placeholder="Qnt" min="0" max="9999" required/>
<div id="dynamicInput"></div>
<input type="button" value="New Product" onclick="addInput('dynamicInput');" />
我的建议是，您将想要克隆的元素包装在一个div中，当用户单击按钮时克隆它，然后将它放在dynamicInput下
null
function addInput(divName) {
var copy = document.getElementById('forclone').cloneNode(true);
document.getElementById(divName).appendChild(copy);
}
document.getElementById('button').onclick = function(){
addInput('dynamicInput');
} <form class="new" method="post" action="phppage">
<fieldset id="products"> <legend> PRODUCTS </legend>
<div id = 'forclone'>
<select name="tProduct" id="cProduct">
<optgroup label="GALLON BAG">
<option>Product1</option>
<option>Product2</option>
<option>Product3</option>
</optgroup>
</select>
<label for="cQuantity">Quantity:<span style="color:red">*</span></label> <input type="number" name="tQuantity" id="cQuantity" placeholder="Qnt" min="0" max="9999" required/>
</div>
<div id="dynamicInput"></div>
<input type="button" value="New Product" id = 'button' />
我想对Z.Better说声谢谢，因为我用了他发帖的想法，所以解决了这个问题，我只是做了一些改变。按照下面与我一起工作的脚本操作。我现在在用。我之所以分享这一点，是因为如果有人有这种怀疑，这就是解决之道。
<script>
function addInput(divName) {
var copy = document.getElementById('forclone').cloneNode(true);
document.getElementById(divName).appendChild(copy);
}
</script>
而且
<form class="new" method="post" action="phppage">
<fieldset id="products"> <legend> PRODUCTS </legend>
<div id = 'forclone'>
<select name="tProduct" id="cProduct">
<optgroup label="GALLON BAG">
<option>Product1</option>
<option>Product2</option>
<option>Product3</option>
</optgroup>
</select>
<label for="cQuantity">Quantity:<span style="color:red">*</span></label> <input type="number" name="tQuantity" id="cQuantity" placeholder="Qnt" min="0" max="9999" required/>
</div>
<div id="dynamicInput"></div>
<input type="button" value="New Product" onclick="addInput('dynamicInput');" />
null
谢谢你们，这个网站太棒了。
