單擊按鈕時會生成一個新的文本框？ - Javascript

所以，我有三個文本框。第一個是要求名字，第二個是姓，第三個是年齡。單擊按鈕時會生成一個新的文本框？ - Javascript

當我點擊按鈕時，應該生成第四個文本框，它應該包含到目前爲止在每個文本框中輸入的所有內容。我的問題是我甚至無法讓第四個文本框出現。我覺得我錯過了很簡單的事情。這是我的代碼到目前爲止。

<html> 

<head> 
</head> 

<body> 

<script> 
function addTextBox() { 
var element = document.createElement("input"); 

element.setAttribute("type", "text"); 
element.setAttribute("value", ""); 
element.setAttribute("name", "Test Name"); 

} 
</script> 

<form> 
<input type="text" value="Firstname"> 

<input type="text" value="Lastname"> 

<input type="text" value="Age"> 

<input type="button" onclick="addTextBox()"> 
</form> 

</body> 

</html>

來源

2015-04-01 Lou

你需要使用的appendChild而你已經創建的元素在體內的元素追加只錯過了將其添加到文檔

function addTextBox() { 
var element = document.createElement("input"); 

element.setAttribute("type", "text"); 
element.setAttribute("value", ""); 
element.setAttribute("name", "Test Name"); 
document.body.appendChild(element); 
}

來源

2015-04-01 04:39:39

我知道這將是一些簡單。謝謝！（： – Lou 2015-04-01 04:45:22

@Lou標記爲答案，如果上述解決您的查詢 – 2015-04-01 04:46:09

<html> 
<head> 
</head> 
<body> 
<script> 
function addTextBox(btn) { 
    var element = document.createElement("input"); 
    element.setAttribute("type", "text"); 
    element.setAttribute("value", ""); 
    element.setAttribute("name", "Test Name"); 
    btn.parentNode.insertBefore(element, btn) 
} 
</script> 
<form> 
<input type="text" value="Firstname"> 
<input type="text" value="Lastname"> 
<input type="text" value="Age"> 
<input type="button" id="btn" onclick="addTextBox(btn)"> 
</form> 
</body> 
</html>

來源

2015-04-01 04:57:20

調用該函數傳遞按鈕id和函數插入該文本框之前插入此按鈕插入.. – 2015-04-01 04:59:24

一個替代方案是創建表單並使用CSS要隱藏它，然後使用你的javascript函數來顯示它並將數據抽入它。

HTML

<form name="myForm"> 
    <input type="text" value="Firstname" /> 
    <input type="text" value="Lastname" /> 
    <input type="text" value="Age" /> 
    <input type="text" value="" name="Test Name" id="box4" style="display:none"> 
    <input type="button" onclick="addTextBox()" /> 
</form>

的JavaScript

function addTextBox() { 
    var box4 = document.getElementById("box4"); 
    box4.style.display = "inline"; 
    var myForm = document.forms['myForm']; 
    for (var i = 0; i < myForm.elements.length; i++) { 
     box4.value += myForm.elements[i].value + ","; 
    } 
}

JS fiddle

來源

2015-04-01 05:10:12 vbranden

單擊按鈕時會生成一個新的文本框？ - Javascript

回答

相關問題