ホームページ >ウェブフロントエンド >jsチュートリアル >Ajax を使用して、データリストをロードするときにロードを求めるプロンプトをサーバーに要求する方法

Ajax を使用して、データリストをロードするときにロードを求めるプロンプトをサーバーに要求する方法

韦小宝
韦小宝オリジナル
2018-01-01 19:43:522364ブラウズ

次のエディターは、ajax を使用してサーバーにデータ リストのロードとプロンプトのロードをリクエストする方法に関する記事を提供します。編集者はこれが非常に優れていると考えているので、ここで ajax ソース コードを共有し、参考として提供します。エディターに従って、ajax を使用してサーバーにデータ リストのロードとプロンプトのロードを要求する方法を見てみましょう。weui.js の weui.loading を効果として使用し、ajax の beforeSend メソッドと complete メソッドを使用してロード時の例を作成します。データの読み込みに数秒かかります...

ページに読み込む必要がある JS ファイル: 52d997c53aa1c059daa5b65545223506

これは weui のドキュメントからダウンロードできます: https://weui.io/weui.js/

ここでは主に、データをクエリするときの jQuery ajax get について説明します。

$.ajax({
  type: 'get',
  url: url,
  data: data,
  dataType: 'json',
  contentType: 'apllication/json; charset=utf-8' ,
  //数据加载前调用的方法 beforeSend()
  beforeSend: function(data){
   //这里判断,如果没有加载数据,会显示loading    
   if(data.readyState == 0){ 
     weui.loading('loading');   
   }
  },
  //数据加载成功调用的方法 sucess()
  sucess: function(data){
    //这里写数据加载成功后,会执行的代码
  },  
  //数据加载成功后调用的方法  complete()
  complete: function(data){
    //这里判断,数据加载成功之后,loading 隐藏
    if(data.status == 200){
      setTimeOut(function(){
        weui.loading('loading').hide();
      },500);
    }
  },
  //数据加载错误后调用的方法 error()
  error: function(data){
    weui.topTips('数据加载失败!');
  }
})


Ajax を巧みに使用してサーバーにデータリストのロードを要求し、ロードメソッドをプロンプトする上記の方法は、エディターによって共有されたすべての内容です。また、皆様にも PHP 中国語 Web サイトをサポートしていただければ幸いです。

関連する推奨事項:

データロード関数のajax実装の詳細な例

ajaxの使用方法の例

ajaxがJavaバックグラウンドに送信された後のデータの処理方法の詳細な説明の例

以上がAjax を使用して、データリストをロードするときにロードを求めるプロンプトをサーバーに要求する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。