ホームページ > ウェブフロントエンド > jsチュートリアル > jQueryのajax属性asyncの例を詳しく解説

jQueryのajax属性asyncの例を詳しく解説

黄舟
リリース: 2017-12-04 16:48:25
オリジナル
2203 人が閲覧しました

日々の開発作業において、ajax は私たち全員が学ぶ必要があるものです。そのため、jquery の ajax では、同期または非同期を実現したい場合、非同期の発生を true または false に直接設定できます。これは true false です。 . 今日はjQueryのajaxpropertyasyncの例を紹介します!

例1、jquery+ajax/" target="_blank">jquery ajax同期メソッド

コードは次のとおりです:

$.ajax({
url : 'test.php',
type : 'post',
async: false,//使用同步的方式,true为异步方式
data : {'act':'addvideo', 'videoname':videoname},//这里使用json对象
success : function(data){
//code here...
},
fail:function(){
//code here...
}
});
ログイン後にコピー

例2

コードは次のとおりです:

//javascript
function test()
{
 var a= 1;
 $.ajax({
  type   : 'GET',
  url    : 'test.php',
  data   : 'page=112',
  success:function(msg)
  {
   alert(msg);
   a= msg;
  }
 })
 alert(a);
}
//test.php
sleef('5'); //休息五分钟
echo 'in';
/*
 这个程序运行情况是  先打印1(a=1) 然后五秒过后 打印 in
 根据这个情况就可以知道 jquery 的ajax的执行流程 
 因为是异步调用
 以前就是这样给一个变量赋值  不管怎么弄都是不对的。最后就发现这个问题
 参数async改为false就为同步调用 当ajax返回结果后程序才继续执行
*/
ログイン後にコピー

ここで、 async のデフォルト設定値は true です。この状況は非同期です。つまり、Ajax がリクエストを送信した後、サーバーが戻るのを待っている間、フロント デスクは Ajax ブロックの背後でスクリプトを実行し続け、成功するまで実行されません。つまり、サーバーは正しい結果を返します。つまり、この時点で 2 つのスレッドが実行されます。1 つのスレッドは ajax ブロックがリクエストを送信し、もう 1 つのスレッドは ajax ブロックの後ろに送信されます。コードは次のとおりです:

$.ajax({  
          type:"POST", 
         url:"Venue.aspx?act=init", 
           dataType:"html", 
          success:function(result){   //function1()
             f1(); 
             f2(); 
        } 
         failure:function (result) {  
            alert('Failed');  
         }, 
  } 
  function2();
ログイン後にコピー

上記の例では、ajax ブロックがリクエストを送信した後、function1() に留まり、サーバーからの戻りを待ちますが、同時に (この待機プロセス中)、フロントデスクは function2() を実行します。つまり、この時点で 2 つのスレッドが表示されます。これを function1() と function2() と呼びます。 asyn が false に設定されている場合、ajax リクエストは同期されます。つまり、ajax ブロックはリクエストを送信した後、 function1() で待機し、 function1() 部分が実行されるまで function2() を実行しません。


同期とは、 JS コードが現在の AJAX にロードされると、ページ内のすべてのコードがロードを停止し、ページは一時停止状態を終了し、他のコードはページの実行後に引き続き実行されます。この属性は、AJAX コードの実行中に実行されます。

関連する推奨事項:

ES6 の async+await 同期/非同期ソリューションの詳細な説明

JavaScriptでのasyncの使い方の詳しい説明

以上がjQueryのajax属性asyncの例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート