Die Methode jQuery val() wird verwendet, um den Wert eines Elements abzurufen. Diese Funktion wird verwendet, um den Wert zu setzen oder zurückzugeben. Der Rückgabewert gibt das Wertattribut des ersten Elements zurück. Im Falle des eingestellten Werts wird der Wert des Attributs für alle Elemente festgelegt. Dieses Element wird hauptsächlich bei HTML-Formularen verwendet.

Syntax:

$(selector).val(function(index, currentvalue))

Beispiel 1: Dieses Beispiel wird implementiert, indem ein Text in das Feld geschrieben wird und wenn auf die Schaltfläche "Wert anzeigen" geklickt wird, erscheint ein Popover und zeigt den eingegebenen Text an.

<!DOCTYPE html>
<html lang="en">
  
<head>
    <script src=
"https://code.jquery.com/jquery-3.4.1.min.js">
    </script>
  
    <script>
        $(document).ready(function () {
  
            // On button click, get value
            // of input control Show alert
            // message box
            $("#getValBtnID").click(function () {
                var inputString = $("#userInputID").val();
                alert(inputString);
            });
        });
    </script>
</head>
  
<body>
    <h3 style="color:green">
        GeeksForGeeks
    </h3>
  
    <b>JQuery val() Method</b>
      
    <br><br>
      
    <input type="text" id="userInputID">
    <br><br>
  
    <button type="button" id="getValBtnID">
        Get Value
    </button>
</body>
  
</html>

Ausgabe:

Beispiel 2: Diese Implementierung zeigt die set value-Eigenschaft, wenn auf die Schaltfläche geklickt wird. Es ruft automatisch auf und füllt das Textfeld mit den im Code erwähnten vordefinierten Daten.

<!DOCTYPE html>
<html>
  
<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">
    </script>
  
    <script>
        $(document).ready(function () {
            $("#setBtnID").click(function () {
                $("input:text").val("Hello World!");
            });
        });
    </script>
</head>
  
<body>
    <h2 style="color:green">
        GeeksForGeeks
    </h2>
      
    <b>JQuery val() Method</b>
  
    <p>User Text: <input type="text"
        name="userInput">
    </p>
  
    <button id="setBtnID">
        Set the value of the 
        input field
    </button>
</body>
  
</html>

Ausgabe:

jQuery ist eine Open-Source-JavaScript-Bibliothek, die die Interaktionen zwischen einem HTML/CSS-Dokument vereinfacht. Sie ist weithin bekannt für ihre Philosophie „Weniger schreiben, mehr tun“ .
Sie können jQuery von Grund auf lernen, indem Sie diesem jQuery-Tutorial und den jQuery-Beispielen folgen .