如何从插件调用jQuery插件中的公共函数

我正在开发jQuery插件。这是我的第一次，如果这是一个愚蠢的问题，我道歉

我在插件中有几个公共方法

我试图从插件定义内部和插件外部调用这些方法，方法类似于Java中方法的

public

关键字的工作方式，但我一直认为

未定义不是函数

错误

我试着用几种方法来称呼它，但仍然无法使它起作用

有什么办法吗

下面是我的代码库示例：

$(document).ready(function() {    

    (function($) {

        // Plugin Definition
        $.fn.popup = function(options){
            // code here...

            // SUBMIT FORM
            $(settings.popupSubmitSelector).on("click", function(e) {
                submitForm();             // call to my method
                this.submitForm();
                $.fn.popup.submitForm();   
            });

            // more code here...

            // my public method
            this.submitForm = function(){
                // method code here
            }

            // more code...
        }
    }(jQuery));
});

尝试以下方法：

$(document).ready(function () {

$(selector).click(function() {
    nameFunc();
});

});

var nameFunc = function () {

//Code

};

或：

尝试以下方法：

$(document).ready(function () {

$(selector).click(function() {
    nameFunc();
});

});

var nameFunc = function () {

//Code

};

或：

实现目标的一种方法是按如下方式定义您的方法：

$.fn.popup.submitForm = function() {
    //method body
};

您可以在插件外部或内部以相同的方式调用它：

$.fn.popup.submitForm();

实现目标的一种方法是按如下方式定义您的方法：

$.fn.popup.submitForm = function() {
    //method body
};

您可以在插件外部或内部以相同的方式调用它：

$.fn.popup.submitForm();

---

我想我现在明白你的问题了。如果要在同一对象的实例中执行公共方法，则必须正确引用当前实例。在JS中，您可以通过以下方式实现：

var MyObj = function() {
  var instance = this;

  this.publicMethod = function() {
    alert('test');
  }

  var privateMethod = function() {
    instance.publicMethod();
  }

  return this;

}

更新以下是使用代理函数公开功能的插件的基本框架

(function($) {
    var settings = { ... };

    var methods = {
        init: function(options) { ... submitForm() ... },
        submitForm: function() { /* code here */ }
    };

    $.fn.popup = function(method) {
        if (methods[method]) {
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (typeof method === 'object' || !method) {
            return methods.init.apply(this, arguments);
        } else {
            $.error('Method ' + method + ' does not exist on jQuery.popup');
        }
    };

})(jQuery);

然后，您可以通过以下方式从外部访问

$('selector').popup('submitForm');

---

我想我现在明白你的问题了。如果要在同一对象的实例中执行公共方法，则必须正确引用当前实例。在JS中，您可以通过以下方式实现：

var MyObj = function() {
  var instance = this;

  this.publicMethod = function() {
    alert('test');
  }

  var privateMethod = function() {
    instance.publicMethod();
  }

  return this;

}

更新以下是使用代理函数公开功能的插件的基本框架

(function($) {
    var settings = { ... };

    var methods = {
        init: function(options) { ... submitForm() ... },
        submitForm: function() { /* code here */ }
    };

    $.fn.popup = function(method) {
        if (methods[method]) {
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (typeof method === 'object' || !method) {
            return methods.init.apply(this, arguments);
        } else {
            $.error('Method ' + method + ' does not exist on jQuery.popup');
        }
    };

})(jQuery);

然后，您可以通过以下方式从外部访问

$('selector').popup('submitForm');

---

---

---

我已经将整个插件包装在

$（document）.ready（function（）{}）中已经存在，但它似乎无法解决此问题。事件侦听器是从插件定义中调用的。我认为您必须删除“this”前缀，因为您在函数外部调用它……我认为@user3558931在他分享给您的帖子中给出了正确答案。我已将整个插件包装在
$（document）.ready（function（）{}）已经存在，但它似乎无法解决此问题。正在从插件定义中调用事件侦听器。我认为您必须删除“this”前缀，因为你在函数之外调用它…我认为@user3558931在他给你的帖子中给出了正确的答案。我们可以看看你的插件定义的框架吗？你是否遵循了如何开发jQuery插件的教程？@wiesion是的，我查看了上的示例，@dartanian300后者是从2007年开始的，前者似乎是一个断裂的环节。请转到@wiesion，我不知道第二个链接为什么会断开。尝试将http://放在它前面。另外，您发布的页面是我发布的jQuery页面上的一个页面。我们可以看看您的插件定义的框架吗？您是否遵循了如何开发jQuery插件的教程？@wiesion是的，我查看了上的示例，@dartanian300后者是2007年发布的，前者似乎是一个断开的链接。请转到@wiesion，我不知道第二个链接为什么会断开。尝试将http://放在它前面。另外，您发布的页面是我发布的jQuery页面上的一个页面。我想您误解了。我需要从插件本身调用该函数。我还发布了更多信息，这有帮助吗？这正是一开始分享足够信息的目的。除非你真的想在插件之外调用这个方法，否则你不应该在它前面加上
this
。。。。只需将它声明为任何其他函数，它将只能在插件中访问。我需要从插件内部和外部访问。很好。我想我们正在取得进展。然后你可能会想在这篇文章的答案中定义你的方法：稍加修改，我将在上面展示。我想你误解了。我需要从插件本身调用该函数。我还发布了更多信息，这有帮助吗？这正是一开始分享足够信息的目的。除非你真的想在插件之外调用这个方法，否则你不应该在它前面加上
this
。。。。只需将它声明为任何其他函数，它将只能在插件中访问。我需要从插件内部和外部访问。很好。我想我们正在取得进展。然后，您可能想在本文的答案中定义您的方法：稍加修改，正如我将在上面介绍的。但是，这仍然不是jQuery插件的最佳实践。您应该将所有方法收集为私有方法，并通过代理函数公开它们。这似乎是可行的！你还可以提供一个你提到的代理函数方法的例子吗？更新了我的答案并添加了一个使用代理方法的基本插件框架谢谢你的帮助！你能解释一下为什么你的第一个答案是坏习惯吗？就JS而言，这绝对不是坏习惯；这不是jQuery插件的最佳实践。通过使用代理方法，当您在内部使用插件的方法时，您不必显式引用插件的实例，而要从外部公开调用它们，您只需将方法的名称作为参数传递给您的插件。但是，对于jQuery插件来说，这仍然不是最佳做法。您应该将所有方法收集为私有方法，并通过代理函数公开它们。这似乎是可行的！你还可以提供一个你提到的代理函数方法的例子吗？更新了我的答案并添加了一个使用代理方法的基本插件框架谢谢你的帮助！你能解释一下为什么你的第一个答案是坏习惯吗？就JS而言，这绝对不是坏习惯；这不是jQuery插件的最佳实践。通过使用代理方法，在内部使用插件的方法时，不必显式引用插件的实例，只需从外部公开调用它们即可