Remplacer la fonction jQuery .val()?

Question

Existe-t-il un moyen de surcharger facilement la fonction val() de jQuery?

La raison pour laquelle je souhaite le remplacer est que je veux ajouter un traitement à chaque fois qu'une valeur est définie pour un élément. Et je ne veux pas faire un autre setter de valeur personnalisé, tel que myVal().

Answer 1

Vous pouvez stocker une référence à la fonction val d'origine, puis la remplacer et faire votre traitement, puis invoquer avec call, d'utiliser le bon contexte:

(function ($) { 
    var originalVal = $.fn.val; 
    $.fn.val = function(value) { 
    if (typeof value != 'undefined') { 
     // setter invoked, do processing 
    } 
    return originalVal.call(this, value); 
    }; 
})(jQuery); 

Notez que vous pouvez distinguer entre un getter appel $(selector).val(); et un setter appel $(selector).val('new value'); juste en vérifiant si l'argument value est undefined ou non.

Answer 2

Si je vous comprends bien, quelque chose comme cela devrait faire l'affaire très bien:

jQuery.fn.val = function (new_val) { 
    alert("You set a val! How wonderful!"); 
    this.value = new_val; 
}; 

Assurez-vous d'inclure la fonctionnalité régulière: obtenir des valeurs de sélectionne et ainsi de suite. Il suffit de coller ce code après après la bibliothèque jQuery régulière.

Answer 3

Je sais que le problème est vieux mais juste pour donner une solution complète. Pour que jQuery.val() et jQuery.val (value) fonctionnent après le remplacement, vous devez le remplacer correctement et séparément. Parce que lors de l'appel jQuery.val() puis originalVal.call (this, value); ne fonctionnera pas correctement.

Pour le faire de manière correcte, vous devez faire quelque chose comme ça quand vous obtenez la valeur: originalVal.call (this);

Voici un site où tout est expliqué: http://extremedev.blogspot.com/2012/01/override-jqueryval-and-jqueryvalvalue.html

Cordialement, Roman

Answer 4

Je sais qu'il est un vieux sujet, mais il est d'abord dans la recherche Google et la réponse est tout à fait raison ...

Par exemple, si vous essayez dans la console $('#myinput').val(), vous devriez obtenir la valeur de #myinput.

Mais si vous $('#myinput').val(undefined) vous devez définir la valeur de #myinput! ( Avec la réponse actuelle et les commentaires de celui-ci, vous ne définissez la valeur de #myinput)

Voici une réponse améliorée qui utiliser arguments.

(function ($) { 
    var originalVal = $.fn.val; 
    $.fn.val = function(value) { 
    if (arguments.length >= 1) { 
     // setter invoked, do processing 
     return originalVal.call(this, value); 
    } 
    //getter invoked do processing 
    return originalVal.call(this); 
    }; 
})(jQuery); 

si vous voulez passer tous les arguments que vous pouvez également utiliser appliquer

(function ($) { 
    var originalVal = $.fn.val; 
    $.fn.val = function(value) { 
    if (arguments.length >= 1) { 
     // setter invoked, do processing 
    } else { 
     //getter invoked do processing 
    } 
    return originalVal.apply(this, arguments); 
    }; 
})(jQuery); 

Je l'espère aider!

Answer 5

J'ai quelque chose à ajouter à la réponse CMS, ma mise en œuvre serait différent et comme ceci:

(function ($) { var fnVal = $.fn.val; 
    $.fn.val = function(value) { 
     if (typeof value == 'undefined') { 
      return fnVal.call(this); 
     } 
     var result = fnVal.call(this, value); 
     $.fn.change.call(this); 
     // here you can add some more implementation 
     return result; 
    }; 
})(jQuery); 

observer la .fn.change $.appelez (ceci); sera appelée avant de quitter la fonction val ('') cela déclenchera aussi le .change() sur chaque affectation val ('').