Reemplace las funciones jQuery centrales en el nivel Elemento

¿Es posible anular las funciones jQuery centrales en el nivel del Elemento? Por lo tanto, para un ejemplo, quiero anular la función val () solo en un elemento .

si hago algo como esto

var element = $('select'); var old_val = element.val; element.val = function () { console.log('The new val'); return old_val.apply(this, arguments); } element.val(19); 

funciona como se esperaba, pero tan pronto como abordo el mismo campo con la nueva instancia de jQuery

 var element = $('select'); element.val(19); 

deja de funcionar porque tenemos una nueva instancia de objeto jQuery. Si toco la función $ .fn.val , cambio ese comportamiento para todos los objetos que admiten la función val, lo cual es demasiado para mí.

Cualquier ayuda será apreciada. Gracias.

Hice esta extensión jquery para hacer solo lo que estás hablando:

 // overrides a method thats supposed to be called on a single node (a method like val) $.fn.overrideNodeMethod = function(methodName, action) { var originalVal = $.fn[methodName]; var thisNode = this; $.fn[methodName] = function() { if (this[0]==thisNode[0]) { return action.apply(this, arguments); } else { return originalVal.apply(this, arguments); } }; }; 

Bonificación por la respuesta de Dave: no tiene que contaminar el espacio de nombres de datos de jQuery o preocuparse por que alguien sobrescriba esa clave

Basado en la respuesta de sdleihssirhc, pero modificado para que solo se aplique a los elementos coincidentes anteriormente, ya que usted dijo “solo en un elemento

 element.data('custom_val', function() { console.log('The new val'); }); $.fn.old_val = $.fn.val; $.fn.val = function () { var custom_val = this.data('custom_val'); if (custom_val) { return custom_val.apply(this, arguments); } else { return this.old_val.apply(this, arguments); } }; 

Este pequeño fragmento permite anular los métodos jQuery.

Me parece que la respuesta de @BT es bastante mala ya que crea una callback adicional cada vez que se utiliza la función. Entonces, si lo aplicas a 1000 elementos, ¡se llaman 1000 funciones para CADA val() !

Mi overrideNodeMethod se puede aplicar a tantos elementos como desee. Básicamente comprueba los datos del hasOverriddenMethod .

 var originaljQueryMethods = {}; for(var method in $.fn){ originaljQueryMethods[method] = $.fn[method]; }; $.fn.callOriginalMethod = function(method, args) { return originaljQueryMethods[method].apply(this, args); }; $.fn.overrideNodeMethod = function(method, callback) { var dataKey = "hasOverriddenMethod." + method; $(this).callOriginalMethod("data", [dataKey, callback]); $.fn[method] = function() { var callback = $(this).callOriginalMethod("data", [dataKey]) if (callback) { return callback.apply(this, arguments); } return $(this).callOriginalMethod(method, arguments); }; }; 

Cada objeto jQuery incluye una propiedad de selector , que contiene (duh) el selector original que se usó para obtener los elementos (realmente no he trabajado con él en absoluto, por lo que no estoy seguro de lo que sucede al pasar por un cadena de metodos).

Por lo tanto, podría ajustar el método val en una función que verifique la propiedad del selector y luego decida si usar su función o la original. Se vería algo como esto:

 $.fn.old_val = $.fn.val; $.fn.val = function () { if (this.selector === 'select') { console.log('The new val'); } return this.old_val.apply(this, arguments); }; 

Básicamente tenías esto antes, solo lo estoy ajustando para que se aplique a todas las nuevas instancias de jQuery.

(Además, esto es bastante simplista por sí mismo; querrá modificarlo / mejorarlo en consecuencia).

Sí, esta es una gran pregunta. Nunca intentaría esto.

Vamonos:

Antes de comenzar, deberíamos copiar la función val predeterminada en otro lugar:

 jQuery.fn.oldval = jQuery.fn.val; 

Escribiría una función global para capturar la función val ():

 jQuery.fn.val = function(value) { var t = jQuery(this); if(t.get(0)) { //Check for overwritten function var func = jQuery.data(t.get(0), 'val-function'); if(jQuery.isFunction(func)) { return func(value); } } //Use old function return jQuery(this).oldval(value); }; 

Después de eso, puedes establecer una función para tus Datos-Elemento con:

 var element = jQuery(...); jQuery.data(element.get(0), 'val-function', function(value){ /* Your Function here */ }); 

No sé si esto funciona. Intentalo. Es solo de mi cerebro.

Intereting Posts