jQuery 验证不适用于两个字段

Question

我需要验证域字段是否正确以及占位符字段是否有值。一旦两者都为真，将显示提交按钮。使用 jQuery 验证，我可以检查域是否正确，但它不验证占位符字段。未应用 playerClass 规则：

$(function() {
    $("#form").validate({
        rules: {
            playerClass: {
                required: true
            }
        },
        submitHandler: function() {
            $("body").append("<p>Validation Complete!</p>");
        }
    });
});
jQuery.validator.addMethod("domainChk", function(value, element, params) {
        $(".submit").show();
        if (this.optional(element)) return true;
        var regExp = new RegExp("^(?!www\.|http:\/\/www\.)(([a-zA-Z0-9]|[a-zA-Z0-9][a-zA-Z0-9\-]*[a-zA-Z0-9])\.)+([A-Za-z0-9]|[A-Za-z0-9][A-Za-z0-9\-]*[A-Za-z0-9])$");
        return regExp.test(value);
    },
    function errmess(params, element) {
        $(".submit").hide();
        return "Valid hostname required for player code";
    });
jQuery.validator.addClassRules({
    domainChk: {
        domainChk: true
    }
});

jsFiddle: Link

Answer 1

The playerClass rule is not being applied

您的第二个字段 name="playerClass" 未被验证，因为您没有对其应用任何验证规则。在您的 jsFiddle 或您的 OP 中没有名为 playerClass 的规则，并且您没有对 jsFiddle 中的 playerClass 字段应用任何规则。

即使 playerClass 是自定义规则，表单也被认为是有效的，因为 playerClass 字段在您的 jsFiddle 中是可选的。没有required规则，当该字段留空时，它是有效的。

您也未能关闭 jsFiddle 中的 <form> 元素。没有 </form> 标签。

编辑:

根据文档，任何 ajax() 都应该进入 .validate() 方法中的 submitHandler 函数。

换句话说，您正在使用 click 处理程序破坏验证插件。

I need to validate that both the domain field is correct and that the placeholder field has a value. Once both are true, the Submit button will show.

那么为什么要在 domainChk 规则中显示提交按钮？ 通过此规则后，您将显示带有 [=24= 的按钮].

您通常会使用 .valid() 方法来测试表单和 show/hide 按钮。

$('input[type="text"]').on('click keyup blur', function() {
    if ($('#form').valid()) {
        $(".submit").show();
    } else {
        $(".submit").hide();
    }
});

这更接近它应该的样子：http://jsfiddle.net/e04rca0t/2/

jQuery 验证不适用于两个字段

jQuery validate not working for two fields

javascript

jquery

jquery-validate