HOWTO · jQuery
Verwendung der get()-Methode mit Ajax jQuery
Dieses Tutorial demonstriert die Verwendung der Methode get() zum Senden von GET-Anforderungen mit Ajax jQuery.
Auf dieser Seite
Die Methode get() in jQuery sendet asynchrone GET-Anfragen an den Server, um die Daten abzurufen. Dieses Tutorial demonstriert die Verwendung der get()-Methode in Ajax jQuery.
Verwendung der Methode get() in Ajax jQuery
Wie oben erwähnt, wird get() in jQuery in Ajax verwendet, um GET-Anfragen an den Server zu senden.
Syntax:
$.get(url, [data],[callback])
Die url ist die Anfrage-URL, von der wir die Daten abrufen. Die data sind die Daten, die über eine GET-Anfrage an den Server gesendet werden, und der callback ist die Funktion, die ausgeführt wird, wenn die Anfrage erfolgreich ist.
Lassen Sie uns ein einfaches get()-Beispiel erstellen, das zu demo.php geht und die abgerufenen Daten in der Warnung ausgibt.
Code - HTML:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$.get("demo.php", function(Get_Data, Get_Status){
alert("Data Retrieved: " + Get_Data + "\n GET Status: " + Get_Status);
});
});
});
</script>
</head>
<body>
<button>Send an HTTP GET request to demo.php</button>
</body>
</html>
Code - demo.php ist:
<?php
echo "Hello This is GET request data from delftstack.";
?>
Ausgabe:
Lassen Sie uns ein weiteres Beispiel haben, das die Get-Anforderung sendet, um die Multiplikationstabelle für eine Zahl anzuzeigen.
Code - HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery Ajax get() Demo</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
var Number_Value = $("#input_number").val();
// Send input data to the server using get
$.get("demo.php", {Number: Number_Value} , function(result_data){
// Display the returned data in browser
$("#multiply_result").html(result_data);
});
});
});
</script>
</head>
<body>
<label>Enter a Number: <input type="text" id="input_number"></label>
<button type="button">Press the Button to Show Multiplication Table</button>
<div id="multiply_result"></div>
</body>
</html>
Code - demo.php:
<?php
$num = htmlspecialchars($_GET["Number"]);
if(is_numeric($num) && $num > 0){
echo "<table>";
for($x=0; $x<11; $x++){
echo "<tr>";
echo "<td>$num x $x</td>";
echo "<td>=</td>";
echo "<td>" . $num * $x . "</td>";
echo "</tr>";
}
echo "</table>";
}
?>
Ausgabe:
