我想要一个输入框,用户可以在其中添加或更改文本,同时(或在他们完成后),我想用他们刚刚输入的文本更新 div 内的文本。
这是我使用的代码
JAVASCRIPT:
<script language="javascript" type="text/javascript">
function change(boxid,divtoaffect) {
content = document.getElementById("" + boxid + "").value;
document.getElementById(divtoaffect).innerHTML = content;
}
</script>
HTML:
<table border="0" cellpadding="5" cellspacing="0" style="border-bottom:1px solid black; border-right:1px solid black; border-left:1px solid black; border-top:1px solid black" width="50%">
<tr>
<td >Name:<br/><input type="text" id="text1" onKeyPress="change('text1','output1')" /></td>
<td valign="bottom"><div id="output1" style="font-weight:bold;height:20px;"></div></td>
</tr>
<tr>
<td>Designation:<br/><textarea id="text2" rows="1" onKeyPress="change('text2','output2')"></textarea></td>
<td valign="bottom"><div id="output2" style="height:40px;"></div> </td>
</tr>
<tr>
<td>Address:<br/><textarea id="text3" rows="2" onKeyPress="change('text3','output3')"></textarea></td>
<td valign="bottom"><div id="output3" style="height:50px;"></div></td>
</tr>
</table>
这里的问题是当我在文本框中键入第二个单词时它会更新 DIV,即当我键入一个单词时它不会显示在 DIV 中,而当我键入第二个单词时它会显示 DIV 中的第一个单词.
而且当我在 Textarea 字段中按 Enter 时,在 DIV 中它继续在同一行上。这是图像