How can I check if a jQuery plugin is loaded?

JqueryJquery Plugins

Jquery Problem Overview


Is there any way to check if a particular plugin is available?

Imagine that you are developing a plugin that depends on another plugin being loaded.

For example I want the jQuery Validation plugin to use the dateJS library to check if a given date is valid. What would be the best way to detect, in the jQuery Valdation plugin if the dateJS was available?

Jquery Solutions


Solution 1 - Jquery

Generally speaking, jQuery plugins are namespaces on the jQuery scope. You could run a simple check to see if the namespace exists:

 if(jQuery().pluginName) {
     //run plugin dependent code
 }

dateJs however is not a jQuery plugin. It modifies/extends the javascript date object, and is not added as a jQuery namespace. You could check if the method you need exists, for example:

 if(Date.today) {
      //Use the dateJS today() method
 }

But you might run into problems where the API overlaps the native Date API.

Solution 2 - Jquery

If we're talking about a proper jQuery plugin (one that extends the fn namespace), then the proper way to detect the plugin would be:

if(typeof $.fn.pluginname !== 'undefined') { ... }

Or because every plugin is pretty much guaranteed to have some value that equates to true, you can use the shorter

if ($.fn.pluginname) { ... }

BTW, the $ and jQuery are interchangable, as the odd-looking wrapper around a plugin demonstrates:

(function($) {
    //
})(jQuery))

the closure

(function($) {
    //
})

is followed immediately by a call to that closure 'passing' jQuery as the parameter

(jQuery)

the $ in the closure is set equal to jQuery

Solution 3 - Jquery

To detect jQuery plugins I found more accurate to use the brackets:

if(jQuery().pluginName) {
    //run plugin dependent code
}

Solution 4 - Jquery

for the plugins that doesn't use fn namespace (for example pnotify), this works:

if($.pluginname) {
    alert("plugin loaded");
} else {
    alert("plugin not loaded");
}

This doesn't work:

if($.fn.pluginname)

Solution 5 - Jquery

jQuery has a method to check if something is a function

if ($.isFunction($.fn.dateJS)) {
    //your code using the plugin
}

API reference: https://api.jquery.com/jQuery.isFunction/

Solution 6 - Jquery

I would strongly recommend that you bundle the DateJS library with your plugin and document the fact that you've done it. Nothing is more frustrating than having to hunt down dependencies.

That said, for legal reasons, you may not always be able to bundle everything. It also never hurts to be cautious and check for the existence of the plugin using Eran Galperin's answer.

Solution 7 - Jquery

Run this in your browser console of choice.

if(jQuery().pluginName){console.log('bonjour');}

If the plugin exists it will print out "bonjour" as a response in your console.

Solution 8 - Jquery

This sort of approach should work.

var plugin_exists = true;

try {
  // some code that requires that plugin here
} catch(err) {
  plugin_exists = false;
}

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionVitor SilvaView Question on Stackoverflow
Solution 1 - JqueryEran GalperinView Answer on Stackoverflow
Solution 2 - JqueryrmirabelleView Answer on Stackoverflow
Solution 3 - JquerySuso GuezView Answer on Stackoverflow
Solution 4 - JquerytranteView Answer on Stackoverflow
Solution 5 - JqueryHasanGView Answer on Stackoverflow
Solution 6 - JquerySoviutView Answer on Stackoverflow
Solution 7 - JqueryJoshua PekeraView Answer on Stackoverflow
Solution 8 - JqueryceejayozView Answer on Stackoverflow