jQuery(...).plugin 不是函数，因为未加载 js 文件

Question

我使用了一个插件（在这个例子中是 selectric）。我只在产品页面上加载插件 javascript 文件。

我使用的代码是：jQuery('.myselectpicker').selectric({}); 位于自定义 javascript 文件中在每个页面上加载。

如果我转到产品页面之后的其他页面，我会收到 jQuery(...).selectric is not a function 错误。

我明白为什么会出现错误，因为插件 javascript 文件未包含在头部（仅在产品页面上）。

但是我可以在 jQuery('.myselectpicker').selectric({}); 代码周围放置一些东西，这样它就不会 return 在产品页面以外的其他页面上出现错误吗？
我不想将代码添加到插件 javscript 文件或仅在产品页面上加载的单独 javascript 文件中。
出于性能原因，我不想在每种页面类型上包含所有 javascript 文件。

Answer 1

您可以使用 jquery 的 isFunction 函数 - https://api.jquery.com/jQuery.isFunction/

// Will trigger selectric() function only if it's lib included
if( $.isFunction( $.fn.selectric ) ){
    jQuery('.myselectpicker').selectric({});
}

Answer 2

检查 selectric 是否已加载的另一种方法是检查页面上是否有任何元素需要它，即：

if (jQuery('.myselectpicker').length > 0)
    jQuery('.myselectpicker').selectric({});

这将给出一个错误 - 因此可以与 isFunction 结合使用（参见其他答案，无需在此处重复） - 但是，会让您知道哪些页面需要插件但缺少它，而不是在没有警告的情况下丢失功能。

jQuery(...).plugin 不是函数，因为未加载 js 文件

jQuery(...).plugin is not a function because js file is not loaded

html

javascript

jquery

plugins

jquery-plugins