Javascript:getHtmlNavThumbTogglePanel 不是函数

Question

我有一个 Javascript 库，如下所示

(function ($) {
    var gd_navbar = '#gd-navbar';
    var methods = {
        init: function (options) {
            // set defaults
            var defaults = {
                applicationPath: null,
                //More Data
                enableRightClick: true
            };
            options = $.extend(defaults, options);
            // set global option params
            applicationPath = options.applicationPath;
            preloadPageCount = options.preloadPageCount;
            rewrite = options.rewrite;
            htmlMode = options.htmlMode;
            thumbnails = options.thumbnails;
            saveRotateState = options.saveRotateState;
            enableRightClick = options.enableRightClick;
            // assembly html base
            this.append(getHtmlBase);
            this.append(getHtmlModalDialog);
        }
    };
    function getHtmlNavThumbTogglePanel() {
        return '<li id="gd-nav-right"><i class="fa fa-th-large"></i><span class="gd-tooltip">Thumbnails</span></li>';
    }
})(jQuery);

现在我正在尝试执行名为 getHtmlNavThumbTogglePanel()

的函数

所以我只需编写以下代码

$.getHtmlNavThumbTogglePanel()

但我收到以下错误

$.getHtmlNavThumbTogglePanel is not a function

我也尝试过以下内容

jQuery.getHtmlNavThumbTogglePanel()

但我仍然遇到同样的错误，

我需要做什么才能使用这些功能？

Answer 1

您的 getHtmlNavThumbTogglePanel 目前只是 IIFE 中的一个普通变量名称 - 在其他任何地方都无法访问它。

如果您希望它可以从 jQuery 使用，请将其分配给 $:

$.getHtmlNavThumbTogglePanel = function getHtmlNavThumbTogglePanel() {
  return '<li id="gd-nav-right"><i class="fa fa-th-large"></i><span class="gd-tooltip">Thumbnails</span></li>';
}

不过，它目前只返回一个字符串，这有点奇怪 - 您的意思是返回一个包装在 jQuery 对象中的新元素吗？

$.getHtmlNavThumbTogglePanel = function getHtmlNavThumbTogglePanel() {
  return $('<li id="gd-nav-right"><i class="fa fa-th-large"></i><span class="gd-tooltip">Thumbnails</span></li>');
}