Question

我有这个小注册表

<h2>Please Register Your Account</h2>
                <div class="form-horizontal" id="idFormRegistrazione">
                    <div class="form-group">
                        <label id="labelUsername" for="idUsername" class="col-sm-2 col-xs-2 control-label">Username*</label>
                        <div class="col-sm-10 col-xs-10">
                            <input type="text" class="form-control" id="idUsername" placeholder="Username" name="username">
                        </div>
                    </div>
                    <div class="form-group">
                        <label id="labelName" for="idName" class="col-sm-2 col-xs-2 control-label">Name</label>
                        <div class="col-sm-10 col-xs-10">
                            <input type="text" class="form-control" id="idName" placeholder="Name" name="name">
                        </div>
                    </div>
                    <div class="form-group">
                        <label id="labelSurname" for="idSurname" class="col-sm-2 col-xs-2 control-label">Surname</label>
                        <div class="col-sm-10 col-xs-10">
                            <input type="text" class="form-control" id="idSurname" placeholder="Surname" name="surname">
                        </div>
                    </div>
                    <div class="form-group">
                        <label id="labelEmail" for="idEmail" class="col-sm-2 col-xs-2 control-label">E-mail*</label>
                        <div class="col-sm-10 col-xs-10">
                            <input type="text" class="form-control" id="idEmail" placeholder="Email" name="email">
                        </div>
                    </div>
                    <div class="form-group">
                        <label id="labelPassword" for="inputPassword" class="col-sm-2 col-xs-2 control-label">Password*</label>
                        <div class="col-sm-10 col-xs-10">
                            <input type="password" class="form-control" id="inputPassword" placeholder="Password" name="password">
                        </div>
                    </div>
                    <div class="form-group">
                        <label id="labelPasswordConf" for="idPasswordConf" class="col-sm-2 col-xs-2 control-label">Repeat Password*</label>
                        <div class="col-sm-10 col-xs-10">
                            <input type="password" class="form-control" id="idPasswordConf" placeholder="Repeat Password" name="passwordConf">
                        </div>
                    </div>

                    <p class="text-right" style="color: #E64040;"><b>* Campi Obbligatori</b></p>

                    <div id="idDivErrori">
                        <div id="idErroriRegistrazione">
                            <ul></ul>
                        </div>
                    </div>

                    <button id="idBtnRegister" class="btn btn-lg btn-primary btn-block" type="submit">Register Me</button>

这是jquery.validate插件的规则

<script type="text/javascript">

$(document).ready(function () {

            $('#idFormRegistrazione').validate({
                onsubmit: false,
                onfocusout: false,
                onkeyup: false,
                onclick: false,
                errorContainer: "#idDivErrori",
                errorLabelContainer: "#idDivErrori #idErroriRegistrazione ul",
                wrapper: 'li',
                ignore: '',
                rules: {
                    username: {
                        required: true,
                    },
                    name: {
                        required: false,
                    },
                    surname: {
                        required: false,
                    },
                    email: {
                        required: true,
                        email: true,
                    },
                    password: {
                        required: true,
                    },
                    passwordConf: {
                        required: true,
                        equalTo: '#idPassword'
                    }
                },
                messages: {
                    username: {
                        required: 'Username is Required'
                    },
                    email: {
                        required: 'Email is Required',
                        email:  'Email format is not valid'
                    },
                    password: {
                        required: 'Password is required',
                    },
                    passwordConf: {
                        required: 'You have to Confirm your password',
                        equalTo: 'Confirm your Password Please'
                    }   
                }
            });
        });

        function validateRegistration() {
            var is_valid_form = $('#idFormRegistrazione').validate().form();    
            if (is_valid_form) {            
                return true;
            }
            else {
                return false;
            }
        }
</script>

但是当我调用函数validateRegistration（）时，我得到了错误：

无法读取null

的属性'nodeType'

真的我不知道为什么。请帮帮我

Answer 1

您的数据输入元素未正确包含在div（“伪表格”）中...

<div class="form-horizontal" id="idFormRegistrazione">

您必须将您的输入元素包含在一组<form>代码中。

<form class="form-horizontal" id="idFormRegistrazione">

测试表单并返回布尔值的方法是.valid()。

function validateRegistration() {
    var is_valid_form = $('#idFormRegistrazione').valid();    
    if (is_valid_form) {            
        return true;
    } else {
        return false;
    }
}

引用OP评论：

“我正在validateRegistration() .click()事件#idBtnRegister上呼叫submitHandler

为什么？

$('#idFormRegistrazione').validate({ // your rules and options, rules: { .... }, messages: { .... }, submitHandler: function(form) { // optional // only fires on a valid form alert('form is valid'); return false; // block normal submit action if using ajax here }, invalidHandler: function(event, validator) { // optional // only fires on an invalid form alert('form is invalid'); } });会自动为您点击提交按钮。

{{1}}

Answer 2

我刚遇到此错误的另一个实例。它位于<form>中，其<label>标记带有＆＃39;名称＆＃39;属性等于要验证的字段之一。删除＆＃39;名称＆＃39;来自<label>的属性解决了它（它不应该在那里）。

Answer 3

检查您的表单是否具有“novalidate”属性。如果有的话，将其删除。例：

jquery.validate：无法读取null的属性“nodeType”

3 个答案: