Javascript 提交时的HTML表单未执行外部函数

我有一个HTML表单，在提交时调用一个validate（）函数

如果validate（）函数位于“body”标记末尾的“script”标记内，则submit可以正常工作

否则，即使使用document.ready，submit在外部js文件中也不会调用validate（）函数，如中所示

HTML--

用户名：
密码：
登录
重置

脚本--

$（文档）.ready（函数（）{
var displayError=函数（错误，消息）{
$（“.error block.error msg”）.text（msg）；
如果（错误===真）
$（“.error block”）.show（）；
其他的
$（“.error block”）.hide（）；
返回true；
};
//验证输入字段
var validate=function（）{
var$username=$（“#username”）.val（），
$password=$（“#password”）.val（）；
如果（$username==''| |$password==''）{
displayError（true，'用户名或密码不能为空'）；
返回false；
}else if（$username.length<6 | |$password.length<6）{
displayError（true，“用户名和密码至少应为6个字符”）；
返回false；
}否则{
显示错误（假“）；
返回true；
}
};
});

我是不是遗漏了什么，或者是什么原因造成的。

这是一个有效的方法。如果validate未返回true，则需要捕获submit（）事件

这是您将在jQuery中包含的内容：

$("form").on("submit", function (event) {
    if (!validate()) {
        event.preventDefault();
    }
});

然后您的

标记将只是

供参考

---

原因是，当validate（）函数位于document ready函数内部时，它的作用域是document ready函数，因此内联DOM事件触发器无权访问它。您必须在jQuery函数内设置事件处理程序，或在document ready函数外声明validate（）函数。

validate变量的作用域是放入

$（document.ready）的匿名函数。这意味着它只能从该函数中访问，而不能从位于全局范围内的页面访问

改为使用函数添加事件侦听器：

$(document).ready(function() {

    /* *** */

    //Validating the input fields    
    $("[name=loginForm]").submit(function() {
        var $username = $("#username").val(),
            $password = $("#password").val();

        /* *** */

    });
});

$("form").on("submit", function (event) {
    if (!validate()) {
        event.preventDefault();
    }
});

$(document).ready(function() {

    /* *** */

    //Validating the input fields    
    $("[name=loginForm]").submit(function() {
        var $username = $("#username").val(),
            $password = $("#password").val();

        /* *** */

    });
});