如何在DIV标签上使用jquery验证插件

Question

我有一个包含jquery选项卡的多个步骤的表单。我的意图是验证单个选项卡中的输入文本字段，只有这样用户才能够转到下一个选项卡。在最后一个选项卡中，我想提交表单以及以前选项卡中的所有数据。

如何在DIV标签上使用jquery验证插件，以便可以在单个窗体中使用多个div标签，以及如何验证每个div区域上的输入文本？

谢谢

Answer 1

可以使用自定义的规则，并设置形式 '有效' 的提交根据所选选项卡如：

DIV 1

• txtName的
• txtEmail

div 2

• txtAddress
• txtOther ...

配置将以下内容：

var tab1Valid = false; 
var tabNValid = false; 

jQuery.validator.addMethod('Tab1Validator', isFirstTabValid, '*'); 
jQuery.validator.addMethod('Tab2Validator', isSecondTabValid, '*'); 
... 

$('#tabsForm').validate({ 
      onkeyup: false, 
      submitHandler: onSaveHandler, 
      rules: { 
       txtName: { Tab1Validator: '' }, 
       txtEmail: { Tab1Validator: '' }, 
       txtAddress: { Tab2Validator: '' }, 
... 
      } 
     }); 

isFirstTabValid: function(value, element, params) { 
// validate values accordign 'element' parameter 
// return corresponding true/false 
    }, 

isSecondTabValid: function(value, element, params) { 
     if (tab1Valid === false) { 
return true; // we dont need validate other fields if first tab is not valid. 
} 

// else validate 
    }, 

嗯，是这样的。如你所愿改变，主要想法在这里

Answer 2

你可以临时放置一个表单，并在成功后单独验证div，你可以再次移除表单。