0

js（jquery 1.7）では、次のコードを使用します。ボタンをクリックすると、次の2つのアクションが発生するはずです。1。ステータスの表示（htmlの表示）2。関数を実行してPDFを生成する

$( "#create_box" ).on("click", "#make_pdf_btn",function(){
$('.pdf_status0').html('Generating report...' );  // problematic line
 make_pdf2();
 return false;
  });

それから：

function make_pdf2(){
    $.ajax({
            type: "GET",
            url: "make_pdf.php",   // pdf is created and saved
            async: false,          // synchronous  ajax
            success: function(html){ strReturn = html; }
    });

   if ( strReturn == 'pdfok' ){ 
        $('.pdf_status0').html('Done!<br>');
        $('.pdf_status').show();
       } else {
         $('.pdf_status').html('Error creating pdf.' );  
       }
  return false;

}

問題は、その行$（'。pdf_status0'）。html（'レポートの生成...'）;です。Firefoxで正常に実行されており、「レポートの生成...」というテキストがdivに表示され、「完了！」に置き換えられます。ただし、ChromeとIE8には「レポートの生成..」は表示されません。「完了！」のみが表示されます。そしてpdfが作成されます。

jquery htmlの代わりにalert（'text'）を使用すると、アラートが実行され、アラートがchromeとfirefoxで表示されます。

4

2 に答える 2

1

私はこれがこのようにすべきだと思います：

$(function(){
   $( "#create_box" ).on("click", "#make_pdf_btn",function(){
     $('.pdf_status0').html('Generating report...').promise().done(function(){
        make_pdf2();
     });
     return false;
   });
});

function make_pdf2(){
    $.ajax({
        type: "GET",
        url: "make_pdf.php",   // pdf is created and saved
        async: false,          // synchronous  ajax
        success: function(html){ 
             strReturn = html;
             if ( strReturn == 'pdfok' ){ 
                  $('.pdf_status0').html('Done!<br>');
                  $('.pdf_status').show();
             } else {
                  $('.pdf_status').html('Error creating pdf.' );  
             } 
        }
   });      
}
于 2013-02-03T05:35:04.727 に答える
0

同期ajax呼び出しを行うと、通常、応答が処理されるまでブラウザがロックされます。つまり、すでに変更しているために手遅れになるまで、画面が再描画されて「レポートを生成しています...」メッセージが表示されません。 「完了！」へ。

同期ajaxを使用する正当な理由はほとんどありません。また、非同期に簡単にリファクタリングできないコードには何も表示されません。これにより、ajax呼び出しの進行中にブラウザーが再描画する機会が与えられます。

function make_pdf2(){
    $.ajax({
            type: "GET",
            url: "make_pdf.php",   // pdf is created and saved
            async: true,          // use Asynchronous  ajax
            success: function(html){
               // do all required processing on response in the success callback
               strReturn = html;
               if ( strReturn == 'pdfok' ){ 
                  $('.pdf_status0').html('Done!<br>');
                  $('.pdf_status').show();
               } else {
                  $('.pdf_status').html('Error creating pdf.' );  
              }
           }
    });

  return false;      
}

setTimeout()そうは言っても、古いIE（IE8についてはよくわかりません）がハックで修正できる方法でまだ少し混乱していることに気付くことがあります。

setTimeout(make_pdf2, 4); // make call to make_pdf2() async too
于 2013-02-03T05:17:47.907 に答える