DivのinnerHTMLがjquery ajaxの呼び出し中に更新されない

Question

DIVのhtmlを更新中に問題が発生しています。本部のための
HTMLコードは

<div id="divforlog" style="z-index:200000;overflow:auto;position:fixed;width:400px;height:300px;border:solid 2px gray;padding:10px;background-color:#F1F1F1"> 
</div> 

私はこの隠されたdiv要素を示してコードを呼び出すボタンのクリック時です。そして、ページIdを含む文字列の配列をとります。各IDについて、jqueryを使用して ".ashx"ページを呼び出し、成功するとdivのhtmlを更新します。これはFirefoxではうまく動作しますが、他のブラウザ（ChromeとIE）ではうまく動作しません。すべての関数の最後にjquery "slideUp"メソッドを使用してdivを非表示にします。このスライドはfrefox、IE、chromeで動作し、消滅する前にdivの内部HTMLをすべて表示します。だから私の主な問題は、divが表示されず、更新されないということです。 Javascreiptでtheereはプログレスバーに使用されるdivのリファレンスでもあり、IEやChromeでは表示されません。

var progress=0; 
    var totalpages; 
    var logstring=""; 


    function getProgressBarValue(){ 

    var s = '<span style="text-align:center;display:block">' + Math.round($("#progressbar").progressbar("option", "value")) + '%</span>'; 
    return s; 
    } 

    function UpdateProgressBar(arg){ 
     if(arg == 0){ 
      var pvalue = (progress/totalpages) * 70; 
      $("#progressbar").progressbar("option", "value", pvalue); 
     } 
     else{ 
      $("#progressbar").progressbar("option", "value", 100); 
     } 

    } 

    function getPageName(PageID) 
    { 
     return PageName; //string 
    } 

    function DisplayLogDiv(){ 

    $("#divforlog").css("display",""); 
    $("#divforlog").css(("top"),300); 
    $("#divforlog").css(("left"),300); 
    $("#divforlog").html(""); 
    $("#divforlog").slideDown(); 

    $("#progressbar").css(("top"),280); 
    $("#progressbar").css(("left"),300); 
    $("#progressbar").show(); 
    $("#progressbar").progressbar({ value: 0 }); 
    $("#progressbar").progressbar("option", "value", 0); 
    logstring = ""; 
    progress=0; 
    totalpages; 

    } 

    function AddLog(logstr){  
     $("#divforlog").html(getProgressBarValue() + logstring);  
     }  

    $('#mybutton').click(function(){   
    DisplayLogDiv();                     

     $('#CustomerDetails').show(); 
     var PageIDs;//it is from some hidden field 
     PageIDs = PageIDs + ","; 
     var pageArray = PageIDs.split(","); 
     totalpages = pageArray.length-1; 

     for (var i=0;i<pageArray.length;i++){ 
      //loop start here 
      if(pageArray[i] != ''){ 
      progress = progress + 1; 

      $.ajax({ 
        contentType: "text/html; charset=utf-8", 
        data: somedatatobepassed , 
        url: "PublishIntermediate.ashx", 
        dataType: "html", 
        async: false, 
        cache:false, 
        success: function(data) { 

        } 
       }); 

      UpdateProgressBar(0); 

      } 

      } 


      $.ajax({ 
        contentType: "text/html; charset=utf-8", 
        data: somedatatobepassed, 
        url: "PublishIntermediate.ashx", 
        dataType: "html", 
        async: false, 
        cache:false, 
        success: function(data) { 

        UpdateProgressBar(100); 

        AddLog(data); 
        } 
       }); 

     $('#CustomerDetails').hide(); 
     $('#divforlog').slideUp(500); 
     $('#progressbar').slideUp(500); 

     return false; 
    }); 

よろしく Ulfatフセイン

Answer 1

これらのコードは、あなたのAjaxの成功状態内部

$('#CustomerDetails').hide(); 
$('#divforlog').slideUp(500); 
$('#progressbar').slideUp(500); 

、