jquery.validate 怎么验证 同名的多个 input 呢？我下面这段代码有什么问题？ 5
<html><head><linkhref="style.css"rel="stylesheet"><scriptsrc="assets/js/jquery-1.7.1....
<html>
<head>
<link href="style.css" rel="stylesheet">
<script src="assets/js/jquery-1.7.1.min.js"></script>
<script src="assets/js/jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#contact-form').validate();
$(":text").each( function(){
$(this).rules( "add", {
required:true,
minlength: 2
})
});
});
</script>
</head>
<body>
<form action="" id="contact-form" class="form-horizontal">
<p>
<input type="text" name="test_a" id="a"><br>
<input type="text" name="test_a" id="b"><br>
<input type="text" name="test_a" id="c"><br>
<button type="submit" class="btn btn-primary btn-large">Submit</button>
<button type="reset" class="btn">Cancel</button>
</form>
</body>
</html>
这个表单的input 是随机生成的，所以name都是相同的，我现在要用jquery.validate.js来验证输入，现在只校验了第一id=‘a' 的，怎么让我验证所有的？ 展开
<head>
<link href="style.css" rel="stylesheet">
<script src="assets/js/jquery-1.7.1.min.js"></script>
<script src="assets/js/jquery.validate.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#contact-form').validate();
$(":text").each( function(){
$(this).rules( "add", {
required:true,
minlength: 2
})
});
});
</script>
</head>
<body>
<form action="" id="contact-form" class="form-horizontal">
<p>
<input type="text" name="test_a" id="a"><br>
<input type="text" name="test_a" id="b"><br>
<input type="text" name="test_a" id="c"><br>
<button type="submit" class="btn btn-primary btn-large">Submit</button>
<button type="reset" class="btn">Cancel</button>
</form>
</body>
</html>
这个表单的input 是随机生成的，所以name都是相同的，我现在要用jquery.validate.js来验证输入，现在只校验了第一id=‘a' 的，怎么让我验证所有的？ 展开
展开全部
JQuery不支持多个input的name属性相同，比较恶心的方式：先把name设置成不同，在提交的时候再修改name属性
$(document).ready(function () {
$('#main').validate();
$('#main input[type=submit]').click(function() {
if ($('#main').valid()) {
$('#main input[name^=foo_]').each(function() {
$(this).attr('name', 'foo');
});
return true;
}
return false;
});
});
<form action="process.cgi" id="main">
<input type="text" name="foo_1" class="required" />
<input type="text" name="foo_2" class="required" />
<input type="text" name="foo_3" class="required" />
<input type="submit" />
</form>
参考
http://jsfiddle.net/xaFZj/41/
$(document).ready(function () {
$('#main').validate();
$('#main input[type=submit]').click(function() {
if ($('#main').valid()) {
$('#main input[name^=foo_]').each(function() {
$(this).attr('name', 'foo');
});
return true;
}
return false;
});
});
<form action="process.cgi" id="main">
<input type="text" name="foo_1" class="required" />
<input type="text" name="foo_2" class="required" />
<input type="text" name="foo_3" class="required" />
<input type="submit" />
</form>
参考
http://jsfiddle.net/xaFZj/41/
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你这么写其实是添加验证成功的了，验证会被执行，只是submit的时候不是你想要的效果。
你可以试试，输入第一个框后，在第二个框里点一下不输入再点到第三个框。
可以看到验证的逻辑被执行了。
分析一下原因：
jquery.validate 这个插件在生成rules的时候是按name来生成的，也就是说，你的表单其实只添加了一条验证rule：就是对name=test_a的字段做非空和最小长度验证。
当输入框失去焦点时会触发这条规则，因为每个input的name都是test_a，可以命中rules中的规则
当submit的时候，同样会调用{'test_a': { required:true, minlength: 2}}这条规则， 只不过这条规则会被通过，因为已经有一个test_a字段达到了规则的要求。
你可以试试，输入第一个框后，在第二个框里点一下不输入再点到第三个框。
可以看到验证的逻辑被执行了。
分析一下原因：
jquery.validate 这个插件在生成rules的时候是按name来生成的，也就是说，你的表单其实只添加了一条验证rule：就是对name=test_a的字段做非空和最小长度验证。
当输入框失去焦点时会触发这条规则，因为每个input的name都是test_a，可以命中rules中的规则
当submit的时候，同样会调用{'test_a': { required:true, minlength: 2}}这条规则， 只不过这条规则会被通过，因为已经有一个test_a字段达到了规则的要求。
更多追问追答
追问
那怎么实现submit的时候全部校验呢？
追答
修改input的name, 动态生成不同的name
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
|
广告 您可能关注的内容 |
