jQuery验证数据属性中的自定义规则

问题描述 投票:5回答:1

我有一个已经有一些验证规则的输入文本

<input type="text" value="" placeholder="Write the code here" 
       name="myCode" id="myCode" data-rule-required="true" 
       data-msg-required="Required field" class="form-control" 
       aria-required="true">

并创建了一个自定义规则来验证代码的语法。

$("#myCode").rules("add", { checkCode: 
    function () { 
        return $('input[name=codeText]').val(); 
    } 
});

通过这个方法,我定义了 myCode 应通过使用 checkCode 方法,而该方法的输入则是接收了 codeText.

这工作真的非常好。然而,为了保持代码的简洁,我想把规则定义移到一个叫做 data-* 属性,但我不明白如何写代码来动态地传递相当于return的 $('input[name=codeText]').val(). 请看下面的问号。

<input type="text" value="" placeholder="Write the code here" 
       name="myCode" id="myCode" 
       data-rule-required="true" data-msg-required="Required field" 
       data-rule-checkCode="????" data-msg-checkCode="Invalid code" 
       class="form-control" aria-required="true">

我必须在属性值中填入什么???

编辑

根据 斯巴基回答 我最后把所有的选择器都放在属性上。就像这样

<input type="text" value="" placeholder="Write the code here" 
   [...]
   data-rule-checkCode="input[name=codeText]" 
   [...]>

然后在我的方法中这样使用

$.validator.addMethod("checkCode", function(value, element, param) {
    return $(param).val();
}, '...');
jquery jquery-validate customvalidator
1个回答
6
投票

并创建了一个自定义规则来验证代码的语法。

$("#myCode").rules("add", { checkCode: 
    function () { 
        return $('input[name=codeText]').val(); 
    } 
});

.rules() 方法是 你怎么 创造 一个自定义规则。 这只是你如何 申报 现有规则对某一输入。

的方法。.addMethod() 方法是你如何在 创造 一个自定义规则。

jQuery.validator.addMethod("checkCode", function(value, element) {
    return $('input[name=codeText]').val();
}, 'Please enter a valid email address.');

然后您可以使用 .rules('add') 将其分配到你的领域...

$('input[name="myCode"]').rules('add', {
    checkCode: true
});

查看: http:/jqueryvalidation.orgjQuery.validator.addMethod。


或者,你也可以通过传入 name 作为一个参数...

jQuery.validator.addMethod("checkCode", function(value, element, param) {
    return $('input[name=' + param + ']').val();
}, 'Please enter a valid email address.');

那么 指派 到你的字段...

$('input[name="myCode"]').rules('add', {
    checkCode: "codeText"
});

至于使用数据属性,它不清楚为什么你需要这样做,当你动态地使用的是 .rules() 方法。

也许在你正确创建了 checkCode 规则,您可以简单地使用 data-rule-checkCode="true"data-rule-checkCode="codeText".

© www.soinside.com 2019 - 2024. All rights reserved.