Question

我正在创建一个包含帐号字段的表单。此帐号有5个文本框，每个文本框的大小=＆＃39; 1＆＃39; 。

<div class="accountNumberWrapper">
    <input class="oneDigit" name="oneDigit" size="1" />
    <input class="twoDigit" name="twoDigit" size="1" />
    <input class="threeDigit" name="threeDigit" size="1" />
    <input class="fourDigit" name="fourDigit" size="1" />
    <input class="fiveDigit" name="fiveDigit" size="1" />
</div>

我正在使用 jQuery Validation Plugin ，并希望仅在第五个框的焦点上验证帐号。我正在使用下面的代码，但它正在每个框中的选项卡上进行验证，

rules: {
    'oneDigit': "meterReading", // custom method
    'twoDigit': "meterReading",
    'threeDigit': "meterReading",
    'fourDigit': "meterReading",
    'fiveDigit': "meterReading"
},      
groups:{
    'meter_reading': "oneDigit twoDigit threeDigit fourDigit fiveDigit"
}

请建议。

Answer 1

您可以使用jQuery事件处理程序：

$( "#target" ).focus(function() {
  /** Your code here **/
});

有关焦点事件处理程序的更多信息 https://api.jquery.com/focus/

$( "#target" ).focusout(function() {
  /** Your code here **/
});

有关焦点事件处理程序的更多信息： https://api.jquery.com/focusout/

并使用.valid()方法进行jQuery Validation Plugin https://jqueryvalidation.org/valid/

Answer 2

您可以将jQuery事件focusOut与验证方法.valid()一起使用。

在你的情况下，它将是：

$(".fiveDigit").on('focusout', function() {
        $(".accountNumberWrapper input").valid();
    }
);

Answer 3

我想仅在第五个方框的focusout验证帐号

编写一个自定义focusout处理程序，在第五个框的focusout事件中触发整个表单的验证测试。

$('[name="fiveDigit"]').on('focusout', function() {
    $('#myform').valid();  // trigger validation of form
});

但它正在每个方框的标签上进行验证

同时禁用插件的默认onfocusout选项，以便在字段之间移动时不会触发验证。

onfocusout: false

DEMO：jsfiddle.net/6mqtqeos/

如何验证最后一个框的焦点？

3 个答案: