2011-02-17 20 views
11

Quiero añadir un método personalizado a un objeto específico de jQuery:¿Forma más fácil de agregar métodos a los objetos jQuery que .data()?

$('#DOMelement').customFunc(param); // not a reality 

Actualmente, tengo:

var customFunc = function(param) { 
    // do something special 
} 
$('#DOMelement').data('customFunc', customFunc); 

que luego llamo, como:

var cF = $('#DOMelement').data('customFunc'); 
cF(param); 

Todos esto funciona, pero es un dolor. ¿Hay una mejor solución? ¿Aparte de escribir un extenso plugin?

Respuesta

9

Su función no parece estar relacionada con ningún elemento en particular, así que ¿por qué no simplemente almacenarla en algún espacio de nombres global?

Si no desea crear otro, puede pedir prestado de jQuery si usted tiene cuidado de no sobreescribir cualquier cosa:

jQuery.cF = function(param) { 
    // do something special 
}; 

$.cF(param); 
+1

¿cómo lo configuraría para estar relacionado con un elemento en particular? –

20

Suena como piensa lo que quiere hacer es un plugin . No es realmente extenso en absoluto. Tomado de http://docs.jquery.com/Plugins/Authoring, sólo puede hacer:

(function($){ 
    $.fn.myPlugin = function() { 

     // Do your awesome plugin stuff here 

    }; 
})(jQuery); 

Entonces llamando es simple:

$('#DOMelement').myPlugin(); 

no creo que debe poner las funciones personalizadas en la propiedad "datos". La propiedad de datos se creó con la intención de incrustando datos personalizados no visibles en su HTML. Aunque supongo que podrías poner funciones allí, no estoy seguro de que sea compatible. Además, todo su código JavaScript se integrará en su elemento HTML.

(Tomado de http://dev.w3.org/html5/spec/Overview.html#embedding-custom-non-visible-data-with-the-data-attributes)

autores pueden incluir datos de secuencias de comandos del lado del cliente en línea o secuencias de comandos en todo el sitio del lado del servidor para procesar el uso de los datos - * = "" atributos. Se garantiza que estos nunca serán tocados por los navegadores, y permitirán que los scripts incluyan datos en elementos HTML que las secuencias de comandos pueden luego buscar y procesar.

Aquí hay otro artículo sobre el uso data: http://www.marcofolio.net/webdesign/html5_data-_attributes_are_great_and_you_know_it.html

0

Usted podría utilizar jQuery.extend().

En su caso particular, usted estaría extendiendo $ así que es mejor que lo haga de la manera de patrick siempre y cuando tenga cuidado de no anular y funciones existentes.

0

Prueba esto:

$.fn.call = function(){};

A continuación, cree una función de un elemento específico:

$('#some_id .some-class').call.myCustomFunction = function(arg1,arg2){ ... };

Ahora, cuando usted quiera llamarlo:

$('#some_id .some-class').call.myCustomFunction('a','b');

Cuestiones relacionadas