Question

我如何观察更改验证表单的输入值？

我的表单有验证脚本。

此功能正常，但只在点击后才会启动。如何在改变时input.val()

观看

form# send - form
input(type = "text"
 data - validate = "name")
button(class = "form_btn")


function validator(el, validName) {
 var mask_name = /^[A-Za-z0-9 ]{3,20}$/;
 var el = el;

 if (validName == "name") {
  var el_val = $(el).val();
  if (mask_name.test(el_val)) {
   $(el).removeClass('error');
  } else {
   $(el).addClass('error');
  }
 }
});

function mainValidation() {

 if ($('#send-form')) {
  $('input').each(function() {
   var this_el = $(this);
   var validName = $(this).data("validate");

   validator(this_el, validName);
  });
 }
};

$('.form_btn').on('click', function(e) {
 e.preventDefault();
 mainValidation();
});

Answer 1

只需为相关输入字段的input事件设置事件处理程序。

 // You need to provide a selector that references the input field properly
 $('inputSelectorHere').on('input', mainValidation);

您还可以等到用户离开输入字段以使用blur事件进行验证：

 // You need to provide a selector that references the input field properly
 $('inputSelectorHere').on('blur', mainValidation);

Answer 2

您可以绑定到输入更改事件：

$('input').on('change', function() {
    var this_el = $(this);
    var validName =  $(this).data( "validate" );

    validator( this_el, validName );
});

Answer 3

尝试：

('input').on('change', function() {
    mainValidation();
});

现在您正在侦听所有输入字段的更改。当字段改变时，它将调用你的函数mainValidation（）。

让我知道。干杯

如何观察更改验证表单的输入值？

3 个答案: