使用 keyup 函数进行表单验证的多步表单答案

【问题标题】：multi step form using keyup function for form validation使用 keyup 函数进行表单验证的多步表单
【发布时间】：2013-12-13 08:46:59
【问题描述】：

我创建了一个多步骤表单。我使用 jquery 在每个步骤上添加验证。如果字段为空，则下一步按钮被禁用。如果字段不为空，则启用下一步按钮。

我使用此代码进行验证

$('form.webform-client-form').bind("change keyup",function(){
var card_name = $('#edit-submitted-first-name1').val();
var card_number = $('#edit-submitted-card-number').val();
var expiration_year = $('#edit-submitted-expiration-year-year').val();
var expiration_month = $('#edit-submitted-expiration-year-month').val();
var cvv = $('#edit-submitted-cvv').val();
if (card_name != "" && card_number != "" && expiration_year != "" && expiration_month !="" && cvv != ""){
  $('form.webform-client-form').find('#edit-submit').attr('disabled', false);
  $('form.webform-client-form').find('#edit-submit').addClass('active');
}
else {
$('form.webform-client-form').find('#edit-submit').attr('disabled', true);
  $('form.webform-client-form').find('#edit-submit').removeClass('active');
}
});

问题在于，当用户在表单中填写信息时，他单击下一个按钮，如果他单击上一个按钮并返回第一个表单，则所有信息都已预先填写，但下一个按钮在用户输入某些值之前不会启用，因为键控功能。如果用户返回上一个表单，我希望启用下一个按钮。

有什么办法可以解决这个问题，或者有什么其他的办法。

任何帮助将不胜感激。

【问题讨论】：

标签： javascript jquery

【解决方案1】：

您需要将下一个按钮的启用和禁用与调用它的唯一事件分离。我会将它移到一个通用函数中，当有相关的键和值从上一步单击下一步按钮时调用该函数。

【讨论】：

【解决方案2】：

首先将绑定中的所有逻辑移到不同的函数中，然后在绑定中调用它，然后在按下后退按钮时调用您用于按键的验证函数。这样它将检查字段并启用按钮

【讨论】：