在没有选择器先决条件的情况下创建自定义jQuery函数

Creating custom jQuery function without selector prerequisite

本文关键字：创建 自定义 jQuery 函数 情况下 选择器 先决条件      更新时间：2023-09-26

我知道我可以通过使用$.fn.myFunction构造函数创建自定义jQuery插件，并将JavaScript中的自定义函数调用为$('selector').myFunction()。

然而，对于我目前正在进行的项目，我需要能够定义一个不需要选择器就能工作的函数。这实际上是针对MessageBox插件的，它的操作方式与C#的MessageBox类类似。因此，理想情况下，我希望将函数创建为MessageBox，然后按如下方式调用它：

var myMessage = $.MessageBox();，然后依次为myMessage.Show();

请注意，在函数调用的开头，jQuery引用中缺少选择器制动器。

如有任何关于最佳实践的建议，我们将不胜感激。

这应该有效：

jQuery.MessageBox = function() {
  var show = function() {
    // something...
  }
  var hide = function() {
    // something...
  }
  return {
    show: show,
    hide: hide
  }
}

重新折叠有一个很好的点，因为您正在弄乱主命名空间。如果你有更多的对象，比如MessageBox，那么一个解决方案是创建你自己的命名空间，如下所示：

jQuery.myLib = {
  MessageBox: function() {
    var show = function() {
      // something...
    }
    var hide = function() {
      // something...
    }
    return {
      show: show,
      hide: hide
    }
  }
}

这意味着您只在主名称空间中占据一个位置(在本例中是库的名称myLib(。你可以这样称呼它：

jQuery.myLib.MessageBox.show()

(function ($) {
    $.MessageBox = function () {
        var show = function () {
            // something...
        }
        var hide = function () {
            // something...
        }
        return {
            show: show,
            hide: hide
        }
    }
})(Jquery);

我认为您最好将范围扩大到即时调用函数，以避免与名称空间发生冲突。

相关文章：