JQuery - Widget Méthodes publiques

Question

Si je crée un widget JQuery (exemple de code ci-dessous), puis que je définis une méthode "public", y a-t-il un autre moyen d'appeler la méthode autrement qu'en utilisant le formulaire suivant?

$("#list").list("publicMethod"); 

Je voudrais créer une série de widgets qui définissent tous les mêmes méthodes (mise en œuvre essentiellement la même interface), et être en mesure d'appeler la méthode sans savoir quoi que ce soit dont widget I actuellement me appel de la méthode sur . Dans le formulaire actuel, j'ai besoin de savoir que j'exécute la méthode sur le widget "liste". Ci-dessous est un exemple de création d'un widget avec la méthode "public".

(function($) { 
    var items = []; 
    var itemFocusIdx = 0; 

    $.widget("ui.list", { 
     // Standard stuff 
     options : { ... }, 
     _create : function() { ... }, 
     destroy : function() { ... }, 

     // My Public Methods 
     publicMethod : function() { ... } 
     ... 
    }); 
}(jQuery)); 

Answer 1

widgets jQuery UI utilisez la méthode $ .data (...) de jQuery pour associer indirectement la classe du widget à l'élément DOM. La meilleure façon d'appeler une méthode sur le widget est exactement ce qui a été décrit par Max ...

$('#list').list('publicMethod'); 

... mais si vous voulez champ une valeur de retour, vous aurez plus de chance d'appeler cette façon , via la méthode de données:

$('#list').data('list').publicMethod(); 

Cependant, en utilisant la deuxième voie latérale étapes tout le modèle widget jQuery UI, et devrait probablement être évitée si possible.

Answer 2

Que diriez-vous celui-ci:

$("#list").list.publicMethod 

Comme vous étendez ui.list avec votre clé: paire de valeurs de consigne

Answer 3

Essayez ceci:

$("#list").list("publicMethod"); 

Answer 4

Un peu hors-sujet, je sais, mais vous voudrez peut-être regarder jquery Entwine. Ceci fournit une forme d'héritage et de polymorphisme qui permet un comportement intelligent avec un code simple. Il semble que cela ferait ce que vous essayez de faire.

Answer 5

permet de dire que vous avez list, list2 et superList ... Appelons « publicMethod » sur pour chacun d'eux:

$.fn.callWidgetMethod = function(method) { 
    var $this = this, 
     args = Array.prototype.slice.call(arguments, 1); 

    // loop though the data and check each piece of data to 
    // see if it has the method 
    $.each(this.data(), function(key, val) { 
    if ($.isFunction(val[method])) { 
     $this[key].apply($this, args); 

     // break out of the loop 
     return false; 
    } 
    }); 
} 

$("#some-element").list(); 
$("#another-element").list2(); 
$("#hydrogen").superList(); 

$("#some-element").callWidgetMethod("publicMethod"); 
$("#another-element").callWidgetMethod("publicMethod"); 
$("#hydrogen").callWidgetMethod("publicMethod"); 

Answer 6

Cette solution est inspirée par @ solution de Jiaaro, mais je besoin d'une valeur de retour et implémenté en tant que fonction JavaScript plutôt que d'étendre jQuery:

var invokeWidgetMethod = function(methodName, widgetElem) 
    { 
     var $widgetElem = $(widgetElem), 
      widgetData = $widgetElem.data(), 
      dataName, 
      dataObject; 

     for(dataName in widgetData) 
     { 
      dataObject = widgetData[dataName]; 
      if ($.isFunction(dataObject[methodName])) { 
       return dataObject[methodName](); 
      } 
     } 
    }