Est-il possible d'obtenir la valeur initiale d'un champ de saisie de formulaire?
Par exemple:
<form action="" id="formId">
<input type="text" name="one" value="one" id="one" />
</form>
$("#one").attr("value"); //would output "one"
$("#one").val(); //would output "one"
$("#one").get(0).value; //would output "one"
Toutefois, si l'utilisateur modifiait alors le contenu du champ de saisie #one
en deux, le code HTML aurait toujours le même aspect (avec un comme valeur), mais les appels JQuery ci-dessus en renverraient deux.
JSFiddle pour jouer avec: http://jsfiddle.net/WRKHk/
Je pense que cela doit encore être possible pour obtenir la valeur initiale, car nous sommes en mesure d'appeler document.forms["formId"].reset()
pour rétablir le formulaire à son état d'origine.
L'élément DOM a l'attribut "value" auquel vous pouvez accéder par:
element.getAttribute('value');
... qui peut être différent de la propriété de l'élément value
.
Notez que vous pouvez appeler .setAttribute('value', 'new value')
, ce qui affectera tout form.reset()
appelé après.
Essaye ça:
$("#one")[0].defaultValue;
L'élément d'entrée a une propriété appelée defaultValue
qui stocke la valeur d'origine.
Pour y accéder via jQuery, utilisez simplement .prop()
:
var value = $(this).prop("defaultValue");
Mise à jour de jsFiddle - après le passage à "deux", ce qui précède renvoie "un".
Le HTML change. Juste que l'outil de source de vue par défaut du navigateur vous montre toujours la source d'origine extraite du serveur. Si vous utilisez quelque chose comme Firebug, vous pourrez voir les changements dynamiques en HTML.
Une façon d'obtenir la valeur initiale consiste à la stocker dans un attribut supplémentaire en plus de 'valeur'. Par exemple, si vous servez votre code HTML comme suit:
<input type="text" name="one" value="one" origvalue="one" id="one" />
Vous pouvez toujours récupérer la valeur d'origine en appelant:
$("#one").attr("origvalue");
Save the original_values @ document.ready.
$(function(){
var original_values = $.map($('form input'), function(input){ return $(input).val() });
})
Vous pouvez essayer de stocker la valeur dans les données. Par exemple:
$('#one').data('val',$('#one').val());
Et ensuite, vous pourrez facilement le récupérer plus tard, comme ceci:
console.log($('#one').data('val'));
var initialVal = $('#one').val();
alert(initialVal);
$('#one').live("focusout", function() {
var attribute = $("#one").attr("value");
var value = $(this).val();
var get = $(this).get(0).value;
alert( "Attribute: " + attribute + "\n\nValue: " + value + "\n\ninit val: " + initialVal +"\n\nGet: " + get );
});