JS:表单输出自动显示在表格里
我有三个文本框,我想每个里面浏览者一输入文字,在表的表格里马上就自动显示出来这个文本框输入的内容,有高手指教 展开
这个很简单,先说一下实现的原理:利用 JavaScript实现表单的实时互动。 再简单介绍实现的过程:先给<body>标签的属性onload属性设置一个值,连接到相应的JavaScript函数,JavaScript函数将文本框中的内容通过innerHTML实时传递到对应ID的表格中的<td></td>标签对中,便实现了你所要的效果。
下面就给你写下具体的代码: (复制粘贴到一个TXT文档中,将后缀名改为htm就可以)
<script language="javascript">
function chk()
{
setTimeout("chk()",100);
text1.innerHTML = form1.t1.value;
text2.innerHTML = form1.t2.value;
text3.innerHTML = form1.t3.value;
}
</script>
<body onload="chk()">
<form name="form1">
<textarea name="t1"></textarea><br />
<textarea name="t2"></textarea><br />
<textarea name="t3"></textarea><br />
</form>
<table border="1" width="200" style="border-collapse: collapse" bordercolor="#008000">
<tr height="100px">
<td id="text1"></td>
</tr>
<tr height="100px">
<td id="text2"></td>
</tr>
<tr height="100px">
<td id="text3"></td>
</tr>
</table>
</body>
先说一下实现的原理:利用 JavaScript实现表单的实时互动。
再简单介绍实现的过程:先给<body>标签的属性onload属性设置一个值,连接到相应的JavaScript函数,JavaScript函数将文本框中的内容通过innerHTML实时传递到对应ID的表格中的<td></td>标签对中,便实现了所要的效果。
下面就给写下具体的代码: (复制粘贴到一个TXT文档中,将后缀名改为htm就可以)
<script language="javascript">
function chk()
{
setTimeout("chk()",100);
text1.innerHTML = form1.t1.value;
text2.innerHTML = form1.t2.value;
text3.innerHTML = form1.t3.value;
}
</script>
<body onload="chk()">
<form name="form1">
<textarea name="t1"></textarea><br />
<textarea name="t2"></textarea><br />
<textarea name="t3"></textarea><br />
</form>
<table border="1" width="200" style="border-collapse: collapse" bordercolor="#008000">
<tr height="100px">
<td id="text1"></td>
</tr>
<tr height="100px">
<td id="text2"></td>
</tr>
<tr height="100px">
<td id="text3"></td>
</tr>
</table>
</body>