web-dev-qa-db-fra.com

JQuery: Obtenir la valeur d'entrée d'origine

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.

21
My Head Hurts

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.

Démo

Notez que vous pouvez appeler .setAttribute('value', 'new value'), ce qui affectera tout form.reset() appelé après.

14
David Hedlund

Essaye ça:

$("#one")[0].defaultValue;
31
graphicdivine

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".

9
Shadow Wizard

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");
2
techfoobar
Save the original_values @ document.ready.

$(function(){
  var original_values = $.map($('form input'), function(input){ return $(input).val() });
})
0
Tom Maeckelberghe

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'));
0
will
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 );
});
0
bondythegreat