实现对表格中input文本框用js或者jquery验证

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){ $("#tab tr").attr("align","center");

$("#but").click(function(){
var _len = $("#tab tr").length;
$("#tab").append("<tr id="+_len+" align='center'>"
+"<td>"+_len+"</td>"
+"<td><input type='text' name='desc"+_len+"' id='Dynamic"+_len+"' /></td>"
+"<td><input type='text' name='desc"+_len+"' id='desc"+_len+"' /></td>"
+"<td><a href=\'#\' onclick=\'deltr("+_len+")\'>删除</a></td>"
+"</tr>");
})

$("#submit").click(function(){
var td = $("#tab :input[type='text']");
for(var i =0;i<td.length;i++){
if($(td[i]).val() == ''){
alert('输入框不能为空');
return;
}

}
});
})
</script>
</head><body>
<table id="tab" border="1" width="60%" align="center" style="margin-top:20px">
<tr>
<td width="20%">序号</td>
<td>标题</td>
<td>描述</td>
<td>操作</td>
</tr>
</table>
<div style="border:2px;border-color:#00CC00;margin-left:20%;margin-top:20px"><input type="button" id="but" value="增加"/></div> <div style="border:2px;border-color:#00CC00;margin-left:20%;margin-top:20px"><input type="submit" id="submit" value="提交表单"/></div>
</body>
</html>

$("#submit").click(function(){
var submit = true;//默认可以提交数据
var td = $("#tab :input[type='text']");
for(var i =0;i<td.length;i++){
if($(td[i]).val() == ''){
submit = false;
alert('输入框不能为空');
$(td[i]).focus();
return;
} }
if(i == td.length && submit){
alert('可以提交数据');
//提交数据

}
});
重新优化了一下

1.其实都是在一个form表单里面只是我让您做的这个是一个table 就是因为有个增加按钮所以我不太会判断我想写成和上面一起提示那种该怎么写那？
2.我觉的您应该能看懂还有就是我判断查找的是 table的 input为空的一共有几个但是在 alert()的时候总是给我提示出来重样的名字就是因为 str +='*债券赎回不能为空'+'\n'; 这句话我应该怎么样获取他们分别的头部名字然后显示出来
function checkForm_info(){
var str = '';
var checkName = $("#client_name").val(); //姓名
var checkTime = $("#client_time").val(); //日期
var checkType = $("#client_type").val(); //类型
var checkPapers = $("#client_papers").val(); //证件号
var checkredeem_type = $("#client_redeem_type").val(); //赎回形式
var checkredeem_time = $("#client_redeem_time").val(); //希望赎回日期
var checkClose_period = $("#client_Close_period").val(); //封闭期形似
var checkzq_type = $("#zhaiquan_style").val(); //债权方式
var checkother_num = $("#other_num").val(); //债权方式选择类型
var checkis_shuhui = $("input[name='redeem_address']").val(); //是否赎回
var checkzq_info = $("#zhaiquan_info").val(); //债权信息

if(checkName == ''){
str +='*客户姓名不能为空'+'\n';
}
if(checkTime == ''){
str +='*申请日期不能为空'+'\n';
} var emptyfields = $(".hksong input[value=]");

for(var i=0;i<emptyfields.length;i++){
if(emptyfields[i].value ==''){
alert(emptyfields.length);
str +='*债券赎回不能为空'+'\n';
}

} if(str == ""){
return true;
}else{
alert(str);
return false;
}
}

类似如下的提交判断<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

        $("#tab tr").attr("align","center");

        $("#but").click(function(){
            var _len = $("#tab tr").length;
            $("#tab").append("<tr id="+_len+" align='center'>"
                                +"<td>"+_len+"</td>"
                                +"<td><input type='text' name='desc' id='Dynamic"+_len+"' /></td>"
                                +"<td><input type='text' name='test' id='desc"+_len+"' /></td>"
                                +"<td><a href=\'#\' onclick=\'deltr("+_len+")\'>删除</a></td>"
                            +"</tr>");
        })
        $("#sub").click(function(){
var str='';
var count=0;
$("input[name='desc']").each(function(index, element) {
                if($(this).val()=='')
{
str+='编号：'+$(this).parent().prev().html()+',描述不能为空!\n';
count++;
}
            });
if(count>0)
alert(str);
});

    })
</script>
</head>

<body>
<table id="tab" border="1" width="60%" align="center" style="margin-top:20px">
    <tr>
        <td width="20%">序号</td>
        <td>标题</td>
        <td>描述</td>
        <td>操作</td>
   </tr>
</table>
<div style="border:2px;border-color:#00CC00;margin-left:20%;margin-top:20px"><input type="button" id="but" value="增加"/></div>

<div style="border:2px;border-color:#00CC00;margin-left:20%;margin-top:20px"><input type="submit" id="sub" value="提交表单"/></div>
</body>
</html>

很类似这个但是这个获取的str +=$(this).attr('name')+'不能为空\n'; 是当前的 name 可是应该是获取到当前上一级tr的名字对应的名字不知道该怎么获取而且是要求input没有输入为空的情况下对应的标题或者怎么将上面标题赋值给下面的input 也行···

$.each($(".hksong input[value=]"),function(){
            if($(this).val() == ''){
                emptyNum++;
                str +=$(this).parent().prev().html()+'不能为空\n';//是否是这样结构我不是很清楚
            }
        })

调试易

实现对表格中input文本框用js或者jquery验证

解决方案 »