使用Bootstrap进行表单validation(jQuery)
有人可以帮我这个代码吗? 我正在使用表单的bootstrap并尝试使用jQueryvalidation它。 不幸的是,表单validation并没有告诉我我做错了什么。 我从http://jqueryvalidation.org/documentation/获得了脚本,并遵循了客户端validation的教程。
//Script found online $(document).ready(function(){ $('#contact-form').validate( { rules: { name: { minlength: 2, required: true }, email: { required: true, email: true }, message: { minlength: 2, required: true } }, highlight: function(element) { $(element).closest('.control-group').removeClass('success').addClass('error'); }, success: function(element) { element .text('OK!').addClass('valid') .closest('.control-group').removeClass('error').addClass('success'); } }); }); // end document.ready Contact Form
我在jsFiddle上设置了代码来尝试诊断问题。
但是,我似乎没有遇到你的问题。 你能看看并告诉我们吗?
HTML
Contact Form
使用Javascript
$(document).ready(function () { $('#contact-form').validate({ rules: { name: { minlength: 2, required: true }, email: { required: true, email: true }, message: { minlength: 2, required: true } }, highlight: function (element) { $(element).closest('.control-group').removeClass('success').addClass('error'); }, success: function (element) { element.text('OK!').addClass('valid') .closest('.control-group').removeClass('error').addClass('success'); } }); });
您可以在本教程中获得另一个validation: http : //twitterbootstrap.org/bootstrap-form-validation
他们使用JQueryvalidation。
jquery.validate.js jquery.validate.min.js jquery-1.7.1.min.js
你会在那里得到源代码。
和JQuery:
以下是代码的实例: http : //twitterbootstrap.org/live/bootstrap-form-validation/
查看完整的教程: http : //twitterbootstrap.org/bootstrap-form-validation/
快乐的编码。
这是一个非常简单轻量级的Boostrapvalidation插件,如果您愿意,可以使用它: https : //github.com/wpic/bootstrap.validator.js
检查这个库 ,它可以通过booth bootstrap 3和bootstrap 4完成
jQuery的
使用Javascript
$(document).on('blur', '[data-validator]', function () { new Validator($(this)); });
请尝试从formor中删除div后尝试在提交按钮上使用onclick方法。