Question

我有jQuery验证问题。我知道它被多次询问但我仍然没有看到我做错了什么

我有这个HTML（编辑：添加整个HTML文件）：

<!DOCTYPE html>
<html>
<head>
    <title>Zaposli me :D</title>
<meta charset='utf-8'>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Bootstrap -->
<link href="../assets/css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="../assets/css/styles.css" rel="stylesheet" media="screen">
<link href="../assets/css/datepicker.css" rel="stylesheet" media="screen">
<link href="../assets/css/login.css" rel="stylesheet" media="screen">
<!--        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>-->
<script src="../assets/js/jquery-1.9.0.js"></script>
<script src="../assets/js/bootstrap.min.js"></script>
<script src="../assets/js/jquery.validate.js"></script>
<script src="../assets/js/bootstrap-datepicker.js"></script>
<script src="../assets/js/holder.min.js"></script>
<script src="../assets/js/ajax.js"></script>
<script src="../assets/js/validation.js"></script>


<style type="text/css">
    label.valid {
        width: 24px;
        height: 24px;
        /*background: url('assets/img/valid.png') center center no-repeat;*/
        display: inline-block;
        text-indent: -9999px;
    }
    label.error {
        font-weight: bold;
        color: #ff4932;
        padding: 2px 8px;
        margin-top: 2px;
    }
</style>

</head>
<body>

<div class="row  container-color">
<div class="col-lg-12">
    <div class="panel">
        <div class="panel-heading"><i class="icon icon-chevron-up chevron"></i>
            <i class="icon icon-wrench pull-right"></i> Dobrodošli
        </div>
        <div class="panel-content form-horizontal">

            <div class="row">
                <!--  ========================================== LEFT PART ==========================================  -->
                <div class="col-lg-6">
                    <form method="POST" id="registrationForm" action="../controllers/forms.php?register=true">
                        <fieldset>
                            <legend>Registruj se</legend>
                            <div class="form-group">
                                <label for="email">Email adresa</label>
                                <input name="email" type="text" class="form-control input-small" id="email" placeholder="Unesite email">
                            </div>
                            <div class="form-group">
                                <label for="name">Ime</label>
                                <input name="name" type="text" class="form-control input-small" id="name" placeholder="Vaše ime">
                            </div>
                            <div class="form-group">
                                <label for="birth">Datum rođenja</label>
                                <input name="birth" type="text" class="form-control input-small datepicker" id="birth" placeholder="Unesite vas datum rodjenja">
                            </div>
                            <div class="form-group">
                                <label for="unique_number">Jednistveni broj</label>
                                <input name="unique_number" type="text" class="form-control input-small" id="unique_number" placeholder="Password">
                            </div>
                            <div class="form-group">
                                <label for="password">Šifra</label>
                                <input name="password" type="password" class="form-control input-small" id="password" placeholder="Password">
                            </div>
                            <div class="form-group">
                                <label for="repeated_password">Ponovite šifru</label>
                                <input name="repeated_password" type="password" class="form-control input-small" id="repeated_password" placeholder="Password">
                            </div>
                            <div class="control-group">
                                <label></label>
                                <div class="controls">
                                    <button type="submit" class="btn btn-default">Registruj se</button>
                                </div>
                            </div>
                        </fieldset>
                    </form>
                </div>

                <!--  ========================================== CENTRAL PART ==========================================  -->
                <div class="col-lg-6">
                    <form method="POST" id="loginForm" action="../controllers/forms.php?login=true">
                        <fieldset>
                            <legend>Uloguj se</legend>
                            <div class="form-group">
                                <label for="loginEmail">Email adresa</label>
                                <input name="loginEmail" type="text" class="form-control input-small" id="loginEmail" placeholder="Unesite email">
                            </div>
                            <div class="form-group">
                                <label for="pass">Password</label>
                                <input name="pass" type="password" class="form-control input-small" id="pass" placeholder="Password">
                            </div>
                            <div class="control-group">
                                <label></label>
                                <div class="controls">
                                    <button type="submit" class="btn btn-default">Uloguj se</button>
                                </div>
                            </div>
                        </fieldset>
                    </form>
                </div>


            </div>

        </div><!--/panel content-->
    </div>

</div>
</div>
<script>
    $('.datepicker').datepicker();
</script>
<!-- JavaScript plugins (requires jQuery) -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="../assets/js/bootstrap.min.js"></script>

</body>
</html>

这个js文件（validation.js）：

jQuery(function(){
    $('#loginForm').validate({
        rules: {
            loginEmail: {
                required: true
            }
        }
    });
});

以下是我收录的文件：

    <script src="../assets/js/jquery-1.9.0.js"></script>
    <script src="../assets/js/jquery.validate.js"></script>
    <script src="../assets/js/validation.js"></script>

我没有收到任何关于不加载文件的错误。但是我确实得到关于Object的错误[object Object]没有方法'validate'。谁知道为什么？

Answer 1

我在使用多个javascript库时遇到了类似的问题（jQuery和其他人正在使用$，并导致多个错误）。

使用noconflict模式我消除了这些问题。

Here是jQuery noconflict模式的链接。希望这有帮助！

Answer 2

如果js说该方法不存在且您知道它确实存在，那么您可能在它加载之前调用它。

确保在尝试执行.validate之前加载js文件。

您尚未发布足够的代码（至少不是全部在上下文中），以查看您何时以及如何加载每个代码。

jQuery validate返回：对象[object Object]没有方法'validate'

2 个答案: