2013-07-09 19 views
0

即时通讯创建onclick事件的动态文本框代码运行正常文本框被创建,但问题是当我创建新的文本框,并填写第一个文本值的一些值存储正常并重新创建新的文本框当时第一个文本框中的数值自动删除或空IM试图解决这个错误,但没有得到答案正确,请帮我....动态文本框不存储在文本框

<html> 
<head> 
<title>Dynamic Form</title> 
<script language="javascript" type="text/javascript" > 
function changeIt() 
{ 

createTextbox.innerHTML = createTextbox.innerHTML +"<br><input type='text' name='mytext' >" 

} 
</script> 
</head> 
<body> 

<form name="form"> 
<input type="button" value="clickHere" onClick="changeIt()"> 
<div id="createTextbox"></div> 
</form> 
</body> 
</html> 
+0

我无法理解的问题完全一样。请看你是否可以通过这个来解释:http://jsfiddle.net/7Yz2f/ – JNF

+0

你还需要创建唯一的名称,因为每个添加的输入都将被命名为mytext。最简单的方法就是使它成为一个数组 - '' – Sean

+0

请运行代码... 并单击clickHere按钮创建文本框并在文本框中填充一些值并再次创建新的文本框,第一个文本框值为空,我想将此值存储在文本中..... –

回答

0

createTextbox是没有明确使用。你必须通过使用document.getElementById来得到它。像这样...

var createTextbox = document.getElementById("createTextbox"); 
createTextbox.innerHTML = createTextbox.innerHTML +"<br><input type='text' name='mytext' >"; 
0

使用createTextbox.innerHTML =,您更换div的当前内容。

使用appendChild功能来解决这个问题,这里是一个例子:

function addInput(){ 
     //get the div element 
     var d = document.getElementById('myDiv'); 
     //create an input element 
     var i = document.createElement("input"); 
     //add it to the div 
     d.appendChild(i); 
    } 
1

请试试这个,

<script type="text/javascript" language="javascript"> 
     function changeIt() { 
      var divTag = document.createElement("input"); 
      document.body.appendChild(divTag); 
     } 
    </script> 

<input type="button" value="Create" 
     onclick="changeIt();" /> 
+0

假设我想创建输入类型文件,所以该怎么办...... –

+0

函数changeIt(){ var divTag = document.createElement(“input”); divTag.type =“file”; document.body.appendChild(divTag); } –

0
<!DOCTYPE html> 
<html> 
<head> 
<script> 
function changeLink() 
{ 
document.getElementById('createTB').innerHTML="<input type='text' />"; 
} 
</script> 
</head> 
<body> 

<div id="createTB"></div> 
<input type="button" onclick="changeLink()" value="Change link"> 

</body> 
</html> 
+0

有关详细信息,请访问http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_elmnt_innerhtml –