Définition de la valeur des zones de texte avec l'un de leurs attributs (jQuery)

Question

J'ai plusieurs boîtes de texte de saisie dont l'attribut ORIGINAL est défini sur leur valeur initiale. Ainsi, lorsque l'utilisateur modifie la valeur de la zone de texte, jQuery peut mettre en surbrillance les éléments a changé (en comparant la valeur actuelle de la zone de texte à la valeur de l'attribut ORIGINAL)

Ce que j'essaie de faire maintenant, c'est de donner à l'utilisateur un bouton sur lequel il peut cliquer pour rétablir toutes les zones de texte à leurs valeurs d'origine valeur de l'attribut ORIGINAL de chaque zone de texte.

Exemple

$('input[type=text]').val($(this).attr('original')); 

Le travail ne marche pas au-dessus et je ne comprends pas pourquoi.

Answer 1

Utilisation each:

$('input:text').each(function() { 
    $(this).val($(this).attr('original')); // or this.value = $(this).attr('original'); 
}); 

Vous ne pouvez pas utiliser un, en une ligne comme $('input[type=text]').val() ne retourneront que la valeur du premier élément de la collection correspondant . $(this) ne veut pas dire ce que vous pensez qu'il fait dans votre exemple:

$('input[type=text]').val($(this).attr('original')); 

Il renvoie en fait à la portée actuelle. Lorsque vous parcourez une collection à l'aide de each, jQuery appelle son rappel et attribue l'élément actuel à l'itération comme portée actuelle ($(this) ou this).

En note, input:text est une manière plus jolie et plus concise de dire input[type=text].

Answer 2

Quelque chose comme ceci:

$('input[type=text]')each(function(){$(this).val($(this).attr('original'));} 

Answer 3

Vous pouvez appeler .defaultValue sur une entrée pour obtenir sa valeur d'origine

Answer 4

val accepte une fonction:

$('input:text').val(function() { 
    return $(this).attr('original'); 
});