本文提供一段JavaScript结合jQuery的代码示例,演示如何遍历HTML表格,提取用户选中的行数据(包括文本和复选框状态),拼接成特定格式的字符串,并通过修改表单action和method属性实现页面提交。代码包含对描述字段的非空校验逻辑,适用于需要批量处理并转发表单数据的场景。
JavaScript表单数据提取与提交实现
示例效果如下图所示:
具体实现代码如下:
}
核心功能代码片段如下:
function forward() {
{
// 遍历表格行,提取选中数据并拼接为字符串
var temp = "";
var array = new Array();
$("#yxdwlb tr").each(function(){
var flag = false;
var user = "";
$(this).find("td").each(function(n){
if(n == 0){
// user = user + $(this).find("input").is(":checked") +"," ;
flag = $(this).find("input").is(":checked");
}
if(n == 1){ user = user + this.innerText + ",";}
if(n == 2){ user = user + $(this).find("input").val() + ",";}
if(n == 3){ user = user + $(this).find("input").is(":checked") + ",";}
if(n == 4){ user = user + $(this).find("input").is(":checked")+ ";";}
});// 结束列遍历
if(flag == true){
array.push(user);
}
});// 结束行遍历
for(var i = 0 ;i<array.length;i++)
{
temp = temp + array[i];// 将数组元素拼接为完整字符串存入temp
}
$("#array").val(temp);// 将拼接结果赋值给隐藏参数array
// 检查描述字段是否为空
var description=jQuery("#description").val();
if(trim(description)=='') {
triman.alert("请输入描述内容!");
return;
}
// 获取表单元素并配置提交属性
var doc = document.getElementById("document");
doc.action = "${pageContext.request.contextPath}/documentManager/save";
doc.method = "post";
doc.submit();
}