Eingabewert in jQuery festlegen
Die Methode val() kann in jQuery verwendet werden, um den Wert eines Eingabefelds in jQuery zu setzen. Dieses Tutorial zeigt, wie Sie die Methode val() verwenden, um den Wert eines Eingabefelds in jQuery festzulegen.
Eingabewert in jQuery festlegen
val() ist eine eingebaute Methode in jQuery, die verwendet wird, um den Wert bestimmter Elemente zurückzugeben oder festzulegen. Wenn diese Methode den Wert zurückgibt, ist dies der Wert des ersten ausgewählten Elements.
Wenn diese Methode verwendet wird, um den Wert eines Elements festzulegen, kann dieser Wert für ein oder mehrere Elemente festgelegt werden. Diese Methode kann auf drei verschiedene Arten verwendet werden.
-
Erstens, um den Wert des Elements zurückzugeben.
Syntax:
$(selector).val() -
Um den Wert des Elements einzustellen.
Syntax:
$(selector).val("value") -
Stellen Sie den Wert über eine Funktion ein.
Syntax:
$(selector).val(function(index, CurrentValue))Wobei der Selektor die ID, die Klasse oder der Name des Elements sein kann, ist der
valueder Wert, der als neuer Wert verwendet werden soll.indexundCurrentValuegeben die Position des Index des Elements in der Menge und den aktuellen Wert des ausgewählten Elements zurück.
Sehen wir uns ein einfaches Beispiel an, um den Wert eines Eingabefelds zurückzugeben.
Beispielcode:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> jQuery Val() Method</title>
<style>
p {
color: green;
margin: 10px;
}
</style>
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</head>
<body>
<input type="text" placeholder="Type Something">
<p></p>
<script>
$( "input" ).keyup(function() {
var Input_Value = $( this ).val();
$( "p" ).text( Input_Value );
}).keyup();
</script>
</body>
</html>
Der obige Code gibt den Wert des Eingabefelds zurück und schreibt ihn in den angegebenen Absatz.
Ausgabe:
Versuchen wir nun, den Wert eines Eingabefeldes mit der Methode val() zu setzen.
Beispielcode:
<!DOCTYPE html>
<html lang="en">
<head>
<title>jQuery val() Method</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$("#DemoInput").val("https://www.delftstack.com/");
});
</script>
</head>
<body>
<h1> jQuery Val() Method</h1>
<label>Enter Your Site:</label>
<input type="text" id="DemoInput">
</body>
</html>
Der obige Code setzt den Wert der angegebenen Eingabe auf https://www.delftstack.com/.
Ausgabe:
Lassen Sie uns die Methode val() mit einer Funktion verwenden.
Beispielcode:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery val() Method</title>
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</head>
<body>
<h1> jQuery Val() Method</h1>
<p>Type anything and it will be converted into Uppercase.</p>
<p>Type and click outside.</p>
<input type="text" placeholder="type anything">
<script>
$( "input" ).on( "blur", function() {
$( this ).val(function( x, Input_Value ) {
return Input_Value.toUpperCase();
});
});
</script>
</body>
</html>
Der obige Code konvertiert den Wert des Eingabefelds in Großbuchstaben.
Ausgabe:
Sheeraz is a Doctorate fellow in Computer Science at Northwestern Polytechnical University, Xian, China. He has 7 years of Software Development experience in AI, Web, Database, and Desktop technologies. He writes tutorials in Java, PHP, Python, GoLang, R, etc., to help beginners learn the field of Computer Science.
LinkedIn Facebook