时间戳

首页 > 解决方案 > 来自另一个 js 文件的 JQuery 验证器调用函数

javascript - 来自另一个 js 文件的 JQuery 验证器调用函数

问题描述

我正在使用 jquery 验证器插件jqueryvalidation并且在从另一个 js 文件调用函数时遇到一些问题。

在一个文件中，theme.js我有一个调用预加载器的函数：

jQuery(document).ready(function ($) {

    function loadAnimation() {
      $("#loader").show().animate({
        opacity: 1
      })
    }
});

我在函数中创建它的原因是我可以从不同的操作和按钮提交调用函数。现在我想从验证器中调用该函数，但出现未定义错误，这是位于另一个文件中的验证器validator.js

jQuery(document).ready(function ($) {

$( "#createForm" ).validate( {
        errorClass: 'text-danger',
        rules: {
            offers: 'required',
            title: 'required',
       },
       submitHandler: function(form) {
            loadAnimation();
            form.submit();
       },
    } );
});

现在表单提交工作，这意味着 submitHandler 工作，但我得到一个错误loadAnimation() is not defined。

我确保 ,jquery之前theme.js已加载，validator.js所以我可能在这里遗漏了一些东西，但我无法弄清楚什么以及如何loadAnimation()从内部submitHandler函数中工作。

标签： javascriptjqueryvalidation

解决方案

正如评论中所指出的，这是一个范围界定问题。为了实现您想要的，您可以在 ready 函数之外提取函数定义以在其他文件中使用它。

function loadAnimation() {
  $("#loader").show().animate({ opacity: 1 })
}

jQuery(document).ready(function($) {
  // code that needs to fire when the page is ready
});

但这会污染全局命名空间，因此要解决这个问题，您需要考虑创建模块并从其他模块导入函数。

推荐阅读