爲什麼在添加另一個字段輸入按鈕時，此代碼不會添加另一個字段？

爲什麼the following code在單擊add another field輸入按鈕時未添加其他文本輸入字段？爲什麼在添加另一個字段輸入按鈕時，此代碼不會添加另一個字段？

<html> 
<head> 
<script> 
function add_field() 
{ 
var elem = document.createElement("input"); 
elem.setAttribute('type','text'); 
elem.setAttribute('name','user'); 
document.body.insertBefore(elem, document.getElementById('su')); 
} 
</script> 
</head> 
<body> 
<form name="input" method="get"> 
Put input here:<br> 
<input type="text" name="user"> 
<input type="button" onclick="add_field()" value="Add another field"><br> 
<input id="su" type="submit" value="Submit"><br> 
</form> 
</body> 
</html>

來源

2012-10-02 Bentley4

按照MDN reference page，你需要調用parent.insertBefore(newElem, referenceElem)。在你的例子中，我認爲<form>是父代，而不是<body>。將您的功能的最後一行更改爲：

var target = document.getElementById('su'); 
target.parentNode.insertBefore(elem, target);

將使其工作。

來源

2012-10-02 09:45:38 Christoffer

jQuery solution here

<form name="input" method="get"> 
    Put input here:<br> 
    <input id='ap' type="text" name="user"> 
    <input id="addField" type="button" value="Add another field"><br> 
    <input id="su" type="submit" value="Submit"><br> 
</form>

的JavaScript

$('#addField').click(function(e) 
{ 
    $('<input type="text" />').insertBefore('#su') 
});

來源

2012-10-02 09:52:33 Undefined

爲什麼在添加另一個字段輸入按鈕時，此代碼不會添加另一個字段？

回答

相關問題