JS:表单输出自动显示在表格里

我现在是这样的我有三个文本框,我想每个里面浏览者一输入文字,在表的表格里马上就自动显示出来这个文本框输入的内容,有高手指教... 我现在是这样的
我有三个文本框,我想每个里面浏览者一输入文字,在表的表格里马上就自动显示出来这个文本框输入的内容,有高手指教
展开
 我来答
詹绍乾
2009-05-07 · TA获得超过178个赞
知道答主
回答量:38
采纳率:0%
帮助的人:41万
展开全部

这个很简单,先说一下实现的原理:利用 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>

shihoumacili
高粉答主

2016-02-01 · 每个回答都超有意思的
知道大有可为答主
回答量:1.1万
采纳率:87%
帮助的人:477万
展开全部

先说一下实现的原理:利用 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>

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式