Unterschied zwischen val () und text ()

Antworten:

284

.val()funktioniert mit Eingabeelementen (oder einem Element mit einem Wertattribut?) und .text()funktioniert nicht mit Eingabeelementen. .val()Ruft den Wert des Eingabeelements ab - unabhängig vom Typ. .text()Ruft den inneren Text (nicht HTML) aller übereinstimmenden Elemente ab:

.text()

Das Ergebnis ist eine Zeichenfolge, die den kombinierten Textinhalt aller übereinstimmenden Elemente enthält. Diese Methode funktioniert sowohl mit HTML- als auch mit XML-Dokumenten. Kann nicht für Eingabeelemente verwendet werden. Verwenden Sie für Eingabefeldtext das Attribut val.

.val()

Ruft den Inhalt des value-Attributs des ersten übereinstimmenden Elements ab

Tvanfosson
quelle
3
lustige Sache - berücksichtigen Sie, dass sie möglicherweise nicht gleich sind fürtextarea someTextArea.html() !== someTextArea.val()
Maciej Jankowski
Verwenden Sie nicht textarea.html ('content'), um Inhalte zu laden. Ich habe einige Inhalte mit jQuery dynamic geladen - der lustige Teil war, als ich auf die Schaltfläche Speichern geklickt habe. Nach dieser Aktion hat sich der Inhalt im Textbereich nicht mehr geändert. Beim Festlegen von Inhalten mit .val ('content') trat dieses Problem nicht auf. Konnte nicht herausfinden warum, aber ich denke, es hat etwas mit DOM-Cache und dem unterschiedlichen Verhalten dieser beiden Methoden zu tun.
Erik Čerpnjak
25

text () gibt den kombinierten Textinhalt aller übereinstimmenden Elemente (wie p, div usw.) zurück. val () wird verwendet, um den Wert eines Eingabeelements (wie Eingabe, Auswahl usw.) zu erhalten.

gemäß der offiziellen Dokumentation sollte text () nicht mit Eingabeelementen verwendet werden


quelle
1

val () wird verwendet, um Werte aus allen HTML-Eingabetypen wie (Kontrollkästchen, Text usw.) abzurufen, wobei der Benutzer die Möglichkeit hat, Werte einzugeben. Ex:-

<input type="text" id="txt_name" /> 
 <input type="checkbox" name="vehicle" value="Bike" id="chk_byk" class="ss">bike<br>   
<script type="text/javascript">
 $(document).ready(function () {

            $("#btn_submit").click(function () {
                alert($("#chk_byk").val());
            });

            });


    </script>

Dabei wird as text () verwendet, um Werte aus den HTML-Elementen abzurufen, bei denen der Benutzer nicht wie (p, div usw.) interagiert. 

    <p id="p1">Hi how are u??</p>
 <div id="dv5">Debendra</div>

 <script type="text/javascript">

        $(document).ready(function () {

            $("#btn_submit").click(function () {
                alert($("#dv5").text());
            });

            });


    </script>
Debendra Dash
quelle
0

Die Funktion .val () gibt den Wert vom Eingabeelement zurück und die Funktion .text () gibt den Wert von anderen als den Eingabeelementen zurück. Wir können diesen Funktionen auch Zeichenfolgenargumente übergeben, um den Wert des aufrufenden Elements festzulegen . Der folgende Code zeigt, wie Sie mithilfe der Funktionen .val () und .text () Werte für DOM-Elemente festlegen:

HTML-Teil:

<form id="form1"><input id="first" type="text" /><input type="submit" /></form>
<div id="second">Click the "Submit Query" to see it work</div>

Jquery Teil:

$(document).on("submit", "form", function (e) {
    $("#first").val("This input is set by .val() function");
    $("#second").text("A new text is set using .text() function!");
    return false;
})

Demo: http://jsfiddle.net/urhys9zj/6/

Himanshu Singh
quelle