Как вы можете проверить, плагин jQuery уже связан с DOM node?

Большинство плагинов jQuery привязаны/привязаны к DOM node при первом их инициализации.

$('#foo').bar({options: ...});

Как вы можете проверить, какие плагины или объекты привязаны к DOM node как #foo?

if($('#foo').bar)
if($.inArray('bar', $('#foo').eq(0)))
if($('#foo').eq(0).indexOf('bar'))
if($('#foo').hasOwnProperty('bar'))

Например, можно связать события с объектом, подобным этому

console.log($('#foo').data('events'));

Ответы

Ответ 1

Если сам плагин не определил какой-либо способ изменения элемента (ов), над которым он работает, это невозможно. Например:

$.fn.extend({
  foo: function() { console.log("I am foo!"); }
});

$('#bar').foo();

Здесь я определил полный (ну, более-менее) плагин jQuery, который даже не пытается взаимодействовать с его вызывающим элементом. Тем не менее, вы можете использовать его, как вам угодно, в любой коллекции элементов, обернутых jQuery, поскольку любая коллекция элементов, обернутая jQuery, имеет этот метод в своем прототипе из-за этой строки (от jquery.js):

jQuery.fn = jQuery.prototype = { ... }

... после того, как $.fn.extend был вызван для подключения этого плагина, каламбур не предназначен.

Но даже если мой плагин должен был каким-то образом изменить свой вызывающий элемент, например:

$.fn.extend({
  bar: function() { this.html('I am all bar now!'); }
});
$('#bar').bar();

... Мне все равно придется обрабатывать это с помощью некоторых внешних событий (DOM Mutation), а не просто зависеть от некоторого внутреннего ведения журнала jQuery.

Ответ 2

В моем случае плагин, который я пытался обнаружить, добавляет некоторые данные в хранилище $(element).data(). Я также видел, что плагины добавляют классы или идентификатор с их именем - или изменением их имени в них.

Ниже приведен код, с которым я сейчас работаю, чтобы решить эту проблему. Наверное, не работает для большинства плагинов.

$.fn.extend({
    isPluginBound: function(pluginName)
    {
        if(jQuery().pluginName)
        {
            var name = pluginName.toLowerCase();

            return this.data(pluginName) || this.data(name)
                || this.attr('class').toLowerCase().indexOf(name) !== -1 // vs hasClass()
                || this.attr('id').toLowerCase().indexOf(name) !== -1;
        }
    }
});

Чтобы использовать его, просто позвоните $('#foo').isPluginBound('bar');

Ответ 3

насколько я знаю, все виджеты jQuery присоединяют свой экземпляр к их DOM node. im, используя расширение follwing в моих проектах. также полезно вызвать метод на виджете, который вы не знаете имени (например, вызов базового метода расширенного виджета)

// returns first found widget instance of the first element or calls method on first widget instance of all elements
$.fn.widget = function ( method , option, value ) { 
  var wi;
  // iterate all elements 
  this.each( function() {
    var wii;
    // iterate all attached data elements, look for widget instances
    $.each( $(this).data(), function( key, data ){ 
      if ( "widgetName" in data ){ wii = data; return false } 
    })
    // if there is a widget instance but no method specified
    if ( wii && !method ) {
      wi = wii;
      return false
    }
    // if there is a widget and there is an object found with the method as the key
    else if ( wii && ( method in wii ) ) {
      // if it is truly a method of that instance, call that instance
      if ( $.isFunction( wii[method] ) ) {
        wi = wii[method].call( wii, option, value )
      } 
      // else, it is maybe a value stored in the instance you seek?
      else {
        wi = wii[method]
      }
    }
  })
  return ( wi === undefined ) ? this : wi ;
}