js 获取表格数据（表单变量值）

js获取表单中的指定动态变量

问题描述：for循环实现表格每行数据输入，对应每行有提交表单需要做相应处理，我们需要获得该行某列的变量值

要求：表格每一行有一个提交按钮实现前台判断操作（判断表格每行第二列的值namefile是否等于动态设置的值）

实现：通过在提交表单οnsubmit="javascript:return checkName()"调用函数checkName()检测，返回false表单不提交，不返回或者返回true提交表单

程序框架如下：

<head>

function checkName(){

}

</script>

</head>

<body>

......

<%for(var i = 0, i < 10, ++i)%>

<tr>

<td>

....

</td>

<td>

<form action="file.action" enctype="multipart/form-data" method="post"

οnsubmit="javascript:return checkName()">

</form>

</td>

<td>

....

</td>

</tr>

</body>

js实现方法：

一、采用getElementById() ，该方法难以实现

原因：getElementById()返回拥有指定id的第一个对象的引用，因为我们实现的是for循环多行数据采用同一个变量，该函数只会得到第一行的对象

getElementById()在js中使用：

var name = getElementById("filename").value; //name为得到的对应id的属性值，filename为id名称

二、采用getElementsByName()，该方法难以实现

原因：getElementsByName()返回指定名称对象的集合，为对象数组结构，对应每一行的提交按钮无法确定是第几行，也无法检测是第几个提交按钮

检测方法比较复杂

三、采用函数传值

有的时候不能采用固定思维，只想到利用HTML DOM 方法，利用函数传值很简单，每行的参数变量是变化的，每行传的形参自然是正确的

代码如下：

<head>

function checkName(subfilename){

if(subfilename == " ") //引号里自己控制，若动态也可以用此函数传形参过来

{

return true;//可以省略

}

else{

alert("请重新选择");

return false;

}

</script>

</head>

<body>

......

<%for(var i = 0, i < 10, ++i)%>

<tr>

<td>

....

</td>

<td>

<form action="file.action" enctype="multipart/form-data" method="post"

οnsubmit="javascript:return checkName(subfilename.value)">

......

</form>

</td>

<td>

....

</td>

</tr>

</body>

测试，此方法简单有效。

转载于:https://blog.51cto.com/carrie1314/1332139

js 获取表格数据（表单变量值）相关推荐

网络安全篇(数据表单的创建 SQL命令拾遗数据的SQL注入的防护)
SQL注入五孔不入,尽管是老技术了,但是依然是重点防护的手段,更多的需要我们数据库开发者细心!! 数据表的演练 1 创建数据表 create database jing_dong charset=ut ...
JS动态模拟Form表单提交数据
分享知识传递快乐 JS动态模拟Form表单提交数据 <!DOCTYPE html> <html lang="en"> <head><m ...
JS表单的获取、表单元素的获取、提交表单
获取表单 document.getElementById("id属性值"),通过表单的id属性值获取属性对象 document.表单的name属性值,通过表单的name属性值获取表 ...
html如何取单元格内容,JS获取表格内指定单元格html内容的方法
JS获取表格内指定单元格html内容的方法本文实例讲述了JS获取表格内指定单元格html内容的方法.分享给大家供大家参考.具体如下: 下面的代码先通过表格对象的rows获得指定的行的所有单元格数组, ...
WEB前端 ---- 学习第二天(表格、表单、css等)
今日内容概要表格标签(只要是展视数据一般都可以使用表格标签) 表单标签(重要:获取前端用户数据发送给后端) 后端框架基本使用(flask) css层叠样式表(选择器) 表格标签数据示例: use ...
HTML之表格与表单
文章目录表格一.表格的格式二.表格标签表单一.作用二.表单结构三.表单控件案例:表格与表单结合表格一.表格的格式 <table> //定义表格<tr> // ...
easyui表单网格列错位_《HTML5从入门到精通》——第3章 HTML表格与表单
<HTML5从入门到精通> ◎千锋教育高教产品研发部/编著 (清华大学出版社出版) 目录第3章 HTML表格与表单................................... ...
HTML-基本语法、常用标签、列表、超链接、超链接定义锚点、表格、表单和内联框架
HTML基本语法  <!DOCTYPE html> <!-- <h ...
HTML5简明教程系列之HTML5 表格与表单（二）
HTML的第二弹也来了,最近高产似母猪,状态也不错,代码来源为实验课.本期主要内容为:HTML表格与DIV应用.HTML表单.上期基础部分的传送门: HTML5简明教程系列之HTML5基础(一)_Th ...

js 获取表格数据（表单变量值）

js 获取表格数据（表单变量值）相关推荐

最新文章

热门文章