首页 > 编程语言 >javascript表单提交的内容显示在表格中

javascript表单提交的内容显示在表格中

时间:2023-02-13 11:02:08浏览次数:41  
标签:chk 表格 javascript value 表单 form1 innerHTML 提交


实现三个文本域的内容提交之后显示在表格中,代码直接用文本文件运行,记得后缀改为.html

运行结果

javascript表单提交的内容显示在表格中_文本文件


输入123,并点击提交按钮之后,数据就会显示在下面的表格中,有什么问题可以私聊我。

javascript表单提交的内容显示在表格中_web_02


下面是代码

<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 οnlοad="chk()">
<form name="form1">
<textarea name="t1"></textarea><br />
<textarea name="t2"></textarea><br />
<textarea name="t3"></textarea><br />
<input type="button" value="提交" onclick="chk()">
</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>


标签:chk,表格,javascript,value,表单,form1,innerHTML,提交
From: https://blog.51cto.com/u_15961549/6053742

相关文章

  • 【JavaScript】11_枚举属性+可变类型+修改对象和属性与方法
    4、枚举属性枚举属性,指将对象中的所有的属性全部获取for-in语句\-语法:for(letpropNamein对象){语句...}\-for-in的循环体会执行多次,有几个属性就会执行几次,每次执......
  • 注册功能分析以及表单校验
    注册功能分析      表单校验表单校验:1.用户名:单词字符,8到20位长度2.密码:单词字符,8到20位长度3.email:邮件格式4.姓名:非空......
  • 实现表格拖拽
    使用sortable.js实现官方网站:http://www.sortablejs.com/中文文档:https://www.itxst.com/sortablejs/neuinffi.htmlyarnaddsortablejsimportSortablefrom"sort......
  • 08 Form表单组件
    Form表单组件form表单向后端提交数据时,需要对用户的输入做校验,比如校验用户是否输入,输入的长度和格式等正不正确。如果用户输入的内容有错误就需要在页面上相应的位置显示......
  • element-ui表格单元格合并后数据出现偏移问题及导出后合计行错位
    合并单元格想要实现的效果为了方便查看表格汇总数据,要求页面将合计数据加在列表第一行,前三个单元格合并,效果图如下:按官方文档实现在el-table标签内加上==:span-method=......
  • 从简单到复杂:深入了解 JavaScript 中的 this 绑定规则
    前言大家好,我是CoderBin,在JavaScript中,this是一个非常重要的概念,属于进阶知识,不管是在面试还是日常开发中都是非常常用的。所以本次给大家总结了关于this的绑定规则,来帮助......
  • 在 JavaScript 中实现原型模式的 2 种方法
    这种模式是JavaScript的核心,也是每个JS开发人员“必须具备”的知识。今天我们将看到一些关于如何实施和使用它的示例和建议。本文将包含JavaScript和TypeScript的示例。......
  • JavaScript 数组求差集
    letarr1=[1,2,3,4,5];letarr2=[4,5,6,7,8];//数组求差集functionarrayDiff(arr1,arr2){//先去重letarr1Unique=[...newSet(arr1)];letarr......
  • 回顾 JavaScript
    回顾JavaScript阅读前建议了解ECMAScript是什么?不然你可能会疑惑下面内容JavaScript中掺杂的ECMAScript需要大体了解过JavaScript主要是对JavaScript复习,温......
  • 前端项目实战28-表单置空数据重置为null
     这样可以实现原来的值......