suchen

Heim  >  Artikel  >  Web-Frontend  >  Globale Ajax-Ereignisreferenzmethode und die Ausführungsreihenfolge jedes Ereignisses (global/lokal)

Globale Ajax-Ereignisreferenzmethode und die Ausführungsreihenfolge jedes Ereignisses (global/lokal)

寻∝梦
寻∝梦Original
2018-09-10 14:42:381937Durchsuche

Dieser Artikel stellt hauptsächlich die globale Ereignisreferenzmethode von Ajax und die Ausführungsreihenfolge jedes Ereignisses vor

Alle globale Ereignisse der Ajax-Methode von jquery:

ajaxStart: bevor die Ajax-Anfrage beginnt

ajaxSend: wenn die Ajax-Anfrage gestellt wird

ajaxSuccess: ajax After Daten abrufen

ajaxComplete: Wenn die Ajax-Anfrage abgeschlossen ist

ajaxError: Nachdem in der Ajax-Anfrage ein Fehler aufgetreten ist

ajaxStop: Nachdem die Ajax-Anfrage gestoppt wurde

Globale Verwendung von Ereignissen durch die Ajax-Methode

Wenn Sie die Ajax-Methode von jquery verwenden, unabhängig davon, ob es sich um $.ajax(), $.get(), $.load(), $.getJSON() handelt usw., globale Ereignisse werden standardmäßig ausgelöst. Globale Ereignisse sind normalerweise nicht gebunden, aber tatsächlich sind diese globalen Ereignisse sehr nützlich.

Das globale Ajax-Ereignis hat ein typisches Anwendungsszenario: Ihre Seite hat mehrere oder sogar eine große Anzahl von Ajax-Anfragen, aber diese Ajax-Anfragen haben den gleichen Nachrichtenmechanismus. Vor dem Start der Ajax-Anfrage wird ein Eingabeaufforderungsfeld mit der Aufforderung „Daten werden gelesen“ angezeigt. Wenn die Ajax-Anfrage erfolgreich ist, wird im Eingabeaufforderungsfeld „Datenerfassung erfolgreich“ angezeigt. Die Möglichkeit, keine globalen Ereignisse zu verwenden, besteht darin, die Callback-Funktionen beforeSend, success und Complete zu $.ajax() hinzuzufügen und in der Callback-Funktion ein Eingabeaufforderungsfeld für die Verarbeitung hinzuzufügen. Die Art und Weise, globale Ereignisse zu verwenden, ist: 

$(document).ajaxStart(onStart)
   .ajaxComplete(onComplete)
   .ajaxSuccess(onSuccess);
function onStart(event) {
	//.....
}
function onComplete(event, xhr, settings) {
	//.....
}
function onSuccess(event, xhr, settings) {
	//.....
}

Die Ausführungsreihenfolge jedes Ereignisses in jquery ist wie folgt

1.ajaxStart (globales Ereignis)

2.beforeSend (lokal Ereignis)

3.ajaxSend (globales Ereignis)

4.success (lokales Ereignis)

5.ajaxSuccess (globales Ereignis)

6.error (lokales Ereignis)

7.ajaxError (globales Ereignis)

8.complete (lokales Ereignis)

9.ajaxComplete (globales Ereignis)

10 .ajaxStop (globales Ereignis)

Beispiel
<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
	</head>

	<body>
		<input type="button" value="点击触发ajax请求" id="ajaxReuqestID" />
		<p id="ajaxStateID"></p>
		<script type="text/javascript" src="js/jquery-3.1.0.min.js"></script>
		<script type="text/javascript">
			$(function() { //点击按钮，并执行ajax请求
				$(document).ajaxStart(function() {
					$("#ajaxStateID").append("ajaxStart" + "<br/>");
					alert("ajaxStart");
				}).ajaxSend(function() {
					$("#ajaxStateID").append("ajaxSend" + "<br/>");
					alert("ajaxSend");
				}).ajaxSuccess(function() {
					$("#ajaxStateID").append("ajaxSuccess" + "<br/>");
					alert("ajaxSuccess");
				}).ajaxError(function() {
					$("#ajaxStateID").append("ajaxError" + "<br/>");
					alert("ajaxError");
				}).ajaxComplete(function() {
					$("#ajaxStateID").append("ajaxComplete" + "<br/>");
					alert("ajaxComplete");
				}).ajaxStop(function() {
					$("#ajaxStateID").append("ajaxStop" + "<br/>");
					alert("ajaxStop");
				});
				$("#ajaxReuqestID").click(function() {
					$.ajax({
						url: "server/ajaxtxt.txt",
						global: true,
						beforeSend: function() {
							$("#ajaxStateID").append("berforeSend" + "<br/>");
							alert("berforeSend");
						},
						success: function() {
							$("#ajaxStateID").append("success" + "<br/>");
							alert("success");
						},
						error: function() {
							$("#ajaxStateID").append("error" + "<br/>");
							alert("error");
						},
						complete: function() {
							$("#ajaxStateID").append("complete" + "<br/>");
							alert("complete");
						}
					});
				});
			});
		</script>
	</body>

</html>







Das obige ist der detaillierte Inhalt vonGlobale Ajax-Ereignisreferenzmethode und die Ausführungsreihenfolge jedes Ereignisses (global/lokal). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：JavaScript berechnet die Entfernung zwischen zwei Orten anhand des Breiten- und LängengradsNächster Artikel：JavaScript berechnet die Entfernung zwischen zwei Orten anhand des Breiten- und Längengrads

In Verbindung stehende Artikel

Mehr sehen