Rufen Sie den Wert in ein Eingabetextfeld ab

1004

Wie kann ein Eingabewert mit jQuery abgerufen und gerendert werden?

Hier ist eine:

$(document).ready(function() {
  $("#txt_name").keyup(function() {
    alert($(this).val());
  });
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<input type="text" id="txt_name" />

Bharanikumar
quelle
1
Verwenden Sie diesen Code: var value = $ ('# txt_Name'). val (); Sie können den Wert auch mit jquery festlegen. Bitte schauen Sie sich diesen Beitrag an: encoding-issues.blogspot.in/2013/10/…
Ranadheer Reddy

Antworten:

1654
//Get
var bla = $('#txt_name').val();

//Set
$('#txt_name').val(bla);
Conrad
quelle
35
@Prabs, die Frage war: "Wie kann ein Eingabewert mit jQuery abgerufen und gerendert werden?", Label ist keine Eingabe.
Barry Michael Doyle
3
Entfernen Sie die Anführungszeichen aus 'bla'. Es sollte $ ('# txt_name') sein. Val (bla);
Charles Xavier
9
@ParbhuBissessar Nicht unbedingt. Wenn er den wörtlichen Text "bla" will, hat er es richtig gemacht. Wenn er das will , valder var bladann muss er die Anführungszeichen entfernen.
double_j
Beachten Sie die get's: "val ()" anstelle von "val" können Sie sich mein Profil
ansehen
Ich habe das getan, aber Probleme gehabt.
Wasey Raza
591

Sie können einen Wert nur auf zwei Arten auswählen:

// First way to get a value
value = $("#txt_name").val(); 

// Second way to get a value
value = $("#txt_name").attr('value');

Wenn Sie direktes JavaScript verwenden möchten, um den Wert zu erhalten, gehen Sie wie folgt vor:

document.getElementById('txt_name').value 
RJD22
quelle
6
Ich weiß, dass dies eine ältere Frage ist, aber vergessen Sie nicht, dass die attrauch durch ersetzt werden kann prop. Das ist semantisch besser.
Sablefoste
Hat nur $("#txt_name").val(str);in Chrome funktioniert, um den Wert festzulegen. Versuchen Sie diesen Beitrag .
Gkiko
Die jQuery-Append-Funktion scheint kein Problem damit zu haben, HTML hinzuzufügen, während Formularwerte beibehalten werden.
Adam F
1
$ ("# txt_name"). attr ('value'); Standardwert zurückgeben / Antwort ist falsch!
Zloctb
1
bedenken Sie, dass und $("#txt_name").attr('value')wird immer den Inhalt des Attributs „Wert“ zurückkehren, so dass , wenn Sie das Eingabefeld ändern, wird der Wert nicht ändert. .val()wird immer den Inhalt des Feldes zurückgeben ..
honk31
84

Es gibt eine wichtige Sache zu erwähnen:

$("#txt_name").val();

gibt den aktuellen realen Wert eines Textfelds zurück, z. B. wenn der Benutzer dort nach dem Laden einer Seite etwas eingegeben hat.

Aber:

$("#txt_name").attr('value')

gibt einen Wert aus DOM / HTML zurück.

Artur79
quelle
40

Sie können das valueAttribut direkt abrufen, da Sie wissen, dass es sich um ein <input>Element handelt, aber Ihre aktuelle Verwendung von .val()ist bereits die aktuelle.

Verwenden Sie .valuefür das oben Gesagte einfach das DOM-Element direkt wie folgt :

$(document).ready(function(){
  $("#txt_name").keyup(function(){
    alert(this.value);
  });
});
Nick Craver
quelle
@ Bharan Warum brauchst du eine Alternative?
Doug Molineux
3
an einem Ort möchte ich Alternative verwenden,
Bharanikumar
16

Sie müssen verschiedene Methoden verwenden, um den aktuellen Wert eines Eingabeelements abzurufen.

METHODE 1

Wenn Sie eine einfache verwenden möchten .val(), versuchen Sie Folgendes:

<input type="text" id="txt_name" />

Werte von Input abrufen

// use to select with DOM element.
$("input").val();

// use the id to select the element.
$("#txt_name").val();

// use type="text" with input to select the element
$("input:text").val();

Setzen Sie den Wert auf Input

// use to add "text content" to the DOM element.
$("input").val("text content");

// use the id to add "text content" to the element.
$("#txt_name").val("text content");

// use type="text" with input to add "text content" to the element
$("input:text").val("text content");

Methode - 2

Verwenden Sie .attr()diese Option , um den Inhalt abzurufen.

<input type="text" id="txt_name" value="" />

Ich füge dem Eingabefeld nur ein Attribut hinzu. value=""Das Attribut ist derjenige, der den Textinhalt enthält, den wir in das Eingabefeld eingegeben haben.

$("input").attr("value");

Methode - 3

Sie können diese direkt auf Ihrem inputElement verwenden.

$("input").keyup(function(){
    alert(this.value);
});
Simplans
quelle
15

Sie können den Wert wie folgt erhalten:

this['inputname'].value

Wobei thissich auf das Formular bezieht, das die Eingabe enthält.

SO ist voller Affen
quelle
8
Bei dieser Antwort wird davon ausgegangen, dass sie thissich auf das Formular bezieht, das die Eingabe enthält.
Nandan
15

Ich denke, diese Funktion fehlt hier in früheren Antworten:

.val( function(index, value) ) 
Dilip Kumbham
quelle
6

Um den Textfeldwert abzurufen, können Sie die jQuery- val()Funktion verwenden.

Zum Beispiel,

$('input:textbox').val() - Textfeldwert abrufen.

$('input:textbox').val("new text message") - Legen Sie den Textfeldwert fest.

Yuval
quelle
3

Für diejenigen, die genau wie ich Neulinge in JS sind und undefinedanstelle von Textwerten sicherstellen, dass Ihre idkeine ungültigen Zeichen enthalten .

Mikhail Sirotenko
quelle
3

Sie können den Wert einfach im Textfeld festlegen.

Zunächst erhalten Sie den Wert wie

var getValue = $('#txt_name').val();

Nachdem ein Wert in der Eingabe wie eingestellt wurde

$('#txt_name').val(getValue);
Muddasir23
quelle
1

Versuche dies. Es wird sicher funktionieren.

var userInput = $('#txt_name').attr('value')
H. Ostwal
quelle
Nein, das wird es nicht !! (1) Wenn es kein Attribut "value" ( <input type="text" />) gibt, wird undefiniert zurückgegeben. (2) Wenn Sie es so machen <input type="text" value="test" />und der Benutzer foo in das Eingabefeld $('#txt_name').attr('value')
eingibt
Diese Antwort ist nicht korrekt, aber dies ist die API, nach der ich gesucht habe.
Anthony