Question

我尝试使用jquery创建一个函数来验证任何表单。我使用bootstrap 3来设计我的所有表单，我想通过强制和特殊验证来验证每个字段。

<form method="POST>    
  <div class="form-group">
      <label for="customerName" class="control-label">Customer Name</label>
      <input type="text" name="customerName" class="form-control mandatory">
      <p class="help-block text-danger error-mandatory"></p>
  </div>
  <div class="form-group">
     <label for="mobile" class="control-label">Mobile No</label>
     <input type="text" name="mobile" class="form-control mandatory validate-mobile">
      <p class="help-block text-danger error-mandatory error-mobile"></p>
  </div>
  <div class="form-group">
    <label for="email" class="control-label">Email</label>
    <input type="text" name="email" class="form-control mandatory validate-email">
    <p class="help-block text-danger error-mandatory error-email"></p>
  </div>
  <div class="form-group">
    <label for="amount" class="control-label">Amount</label>
    <input type="text" name="amount" class="form-control mandatory validate-numeric">
    <p class="help-block text-danger error-mandatory error-numeric"></p>
  </div>
  <div class="form-group">
  <input type="submit" name="submit" onClick="validateForm();" class="btn btn-default">
  </div>
</form>

当用户点击提交按钮表单时，将验证所有输入类型如下：

如果班级mandatory - 验证是否为空
if class mandatory validate-email - 验证为空并验证电子邮件格式
如果类mandatory validate-mobile - 验证为空且仅包含10位数的数字
如果类mandatory validate-numeric - 验证为空并仅接受数字

错误消息显示在

标记类中：

'error-mandatory' , 'error-email', 'error-numeric', 'error-mobile'

分别。我想创建一个JS文件，所以我可以在提交按钮上以任何形式调用此函数。如何构建这个任何解决方案，例如高度赞赏。

使用输入类型中的预定义类进行Jquery表单验证

0 个答案: