Heim > Web-Frontend > js-Tutorial > Der Unterschied zwischen Synchronisation und Asynchronität und Synchronisation und Asynchronität des asynchronen Attributwerts in Ajax

Der Unterschied zwischen Synchronisation und Asynchronität und Synchronisation und Asynchronität des asynchronen Attributwerts in Ajax

亚连
Freigeben: 2018-05-24 15:26:18
Original
1710 Leute haben es durchsucht

In der Ajax-Methode in Jquery wird Async verwendet, um Synchronisation und Asynchronität zu steuern. Wenn der Async-Wert wahr ist, handelt es sich um eine asynchrone Anfrage, und wenn der Async-Wert falsch ist, handelt es sich um eine synchrone Anfrage. Das Async-Attribut in Ajax wird verwendet, um die Art und Weise der Datenanforderung zu steuern. Der Standardwert ist true, was bedeutet, dass Daten standardmäßig asynchron angefordert werden.

Die Ajax-Methode in jquery verfügt über ein Attribut „async“ zur Steuerung der Synchronisation und Asynchronität. Der Standardwert ist „true“, das heißt, die Ajax-Anfrage ist standardmäßig eine asynchrone Anfrage. Diese Synchronisierung bedeutet, dass beim Laden des JS-Codes in das aktuelle AJAX der gesamte Code auf der Seite nicht mehr geladen wird und die Seite in einem angehaltenen Animationszustand angezeigt wird. Wenn das AJAX abgeschlossen ist, wird es weiter ausgeführt Andere Codes und der gesperrte Zustand der Seite werden aufgehoben. Asynchron können andere Codes ausgeführt werden, während dieser AJAX-Code ausgeführt wird.

Das Async-Attribut in Ajax wird verwendet, um die Art der Datenanforderung zu steuern. Der Standardwert ist true, was bedeutet, dass Daten standardmäßig asynchron angefordert werden.

1. Der Async-Wert ist wahr (asynchron)

Wenn Ajax die Anfrage sendet und auf die Rückkehr des Servers wartet, führt der Vordergrund weiterhin Ajax aus Block Das Skript wird erst erfolgreich ausgeführt, wenn der Server das richtige Ergebnis zurückgibt. Das heißt, zu diesem Zeitpunkt werden zwei Threads ausgeführt, ein Thread, nachdem der Ajax-Block die Anforderung gesendet hat, und das Skript, nachdem der Ajax-Block (ein anderer Thread)

Zum Beispiel

$.ajax({  
     type:"POST", 
     url:"Venue.aspx?act=init", 
      dataType:"html", 
     success:function(result){  //function1()
       f1(); 
       f2();  
    } 
     failure:function (result) {  
      alert('Failed');  
     }, 
 } 
 function2();
Nach dem Login kopieren

Wenn im obigen Beispiel der Ajax-Block eine Anfrage stellt, bleibt er in Funktion1() und wartet für die Rückkehr vom Server, aber Gleichzeitig (während dieses Wartevorgangs) führt die Rezeption Funktion2() aus.

2. Der asynchrone Wert ist falsch (synchron)

Wenn der aktuelle AJAX ausgeführt wird, wird die Ausführung des nachfolgenden JS-Codes gestoppt, bis der AJAX abgeschlossen ist . , um mit der Ausführung des folgenden JS-Codes fortzufahren.

Zum Beispiel

$.ajax({  
     type:"POST", 
     url:"Venue.aspx?act=init", 
     dataType:"html", 
     async: false,
    success:function(result){  //function1()
       f1(); 
       f2(); 
     } 
    failure:function (result) {  
      alert('Failed');  
     }, 
 } 
 function2();
Nach dem Login kopieren

Wenn asyn auf false gesetzt ist, wird die Ajax-Anfrage synchronisiert, und das ist Das heißt, nachdem der Ajax-Block zu diesem Zeitpunkt eine Anfrage gesendet hat, wartet er bei Funktion1 () und führt Funktion2 () erst aus, wenn der Teil Funktion1 () abgeschlossen ist.

Der Unterschied zwischen Ajax-Synchronisation und Asynchronität

var returnValue = null; 
xmlhttp = createXmlHttp(); 
xmlhttp.onreadystatechange = function() { 
  if(xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
    if (xmlhttp.responseText == "true") { 
      returnValue = "true"; 
    } 
    else { 
      returnValue = "false"; 
    } 
  } 
}; 
xmlhttp.open("Post",url,true); //异步传输 
xmlhttp.setRequestHeader("If-Modified-Since","0"); //不缓存Ajax
xmlhttp.send(sendStr); 
return returnValue;
Nach dem Login kopieren

xmlHttpReq kann nur asynchron verwendet werden .onreadystatechange Statuswert! Im Folgenden sind die verschiedenen Aufrufmethoden von asynchron und synchron aufgeführt:

Java

xmlHttpReq.open("GET",url,true);//异步方式
  xmlHttpReq.onreadystatechange = showResult; //showResult是回调函数名
  xmlHttpReq.send(null);
function showResult(){  
  if(xmlHttpReq.readyState == 4){   
   if(xmlHttpReq.status == 200){
   ******
   }
  }
}
Nach dem Login kopieren

Java

xmlHttpReq.open("GET",url,false);//同步方式  
      xmlHttpReq.send(null);  
      showResult(); //showResult虽然是回调函数名但是具体用法不一样~  
function showResult(){   
       //if(xmlHttpReq.readyState == 4){  这里就不用了,直接dosomething吧~  
        //if(xmlHttpReq.status == 200){  
          ******//dosomething  
        //}  
      //}  
}
xmlhttp.open("Post",url,true);
Nach dem Login kopieren

Wenn es synchron (falsch) ist, ist der Rückgabewert wahr oder falsch, da nach der Ausführung des Sendens die Ausführung von onreadystatechange beginnt und Das Programm wartet, bis onreadystatechange abgeschlossen ist. Die nächste Anweisung wird erst ausgeführt, wenn der Antworttext abgerufen wird. Daher muss returnValue einen Wert haben.

Wenn es asynchron (true) ist, muss der Rückgabewert null sein, da das Programm nach der Ausführung von send nicht auf die Antwort von xmlhttp wartet und mit der Ausführung der nächsten Anweisung fortfährt, sodass returnValue null zurückgegeben hat bevor es sich geändert hat.

Wenn Sie den xmlhttp-Rückgabewert erhalten möchten, müssen Sie die Synchronisierung verwenden. Der Rückgabewert kann nicht asynchron abgerufen werden.

Bitte beachten Sie bei der synchronen und asynchronen Verwendung des xmlhttp-Pools: Beim Abrufen von xmlhttp können Sie nur ein neues xmlhttp erstellen und das verwendete xmlhttp nicht aus dem Pool entfernen, da der readyState des verwendeten xmlhttp ist 4, daher senden sowohl synchron als auch asynchron onreadystatechange, führen es jedoch nicht aus.

Ich habe das Obige für Sie zusammengestellt und hoffe, dass es Ihnen in Zukunft hilfreich sein wird.

Verwandte Artikel:

Den Wert der Datentypattributoption in Jquery Ajax verstehen

Implementieren eines N-Sekunden-Intervalls basierend auf JQuery Ajax Technologie Werte an eine Seite übergeben

Lösen des Vorwärts- und Rückwärtsproblems von Ajax basierend auf Jquery.history

Das obige ist der detaillierte Inhalt vonDer Unterschied zwischen Synchronisation und Asynchronität und Synchronisation und Asynchronität des asynchronen Attributwerts in Ajax. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage