jQuery的$。員額不工作鉻，但在IE工程和FF

Question

爲我所面臨的問題的代碼片段是：

//select the shipping country to display its shipping rate 
    $('#country').change(function() { 

    if($(this).val() == ""){ 
      $('#shippingRateDisplay').html('<br /><span style="margin-left:8px">No country selected.</span>'); 
      return false; 
     } 
     alert("Before ajax start"); 
    $.post('ajax_utility/getShippingCostProdDtls/', { country_id: $(this).val(), 
                 product_id: <?php echo $this->uri->segment(3); ?>, 
                 current_currency: '<?php echo $product->currency->cur_id; ?>'}, function(data){ alert("Successful ajax, but chrome is not reaching here"); 

     if(data.status != 1){ 
       $('#shippingRateDisplay').html("Shipping rate not set for the specified country"); 
      } 
     else{ 
      $("#shippingRateDisplay").html(""); 

      var conShip = '<br /><table width="100%" cellpadding="0" cellspacing="1" bgcolor="#cdcdcd" class="darbluelink" id="shippingDetails">'+ 
            '<tr>'+ 
             ' <td width="20%" bgcolor="#e9e8e8" class="darkblue text-center" style="padding:7px"><b>Country of delivery</b></td>'+ 
             '<td colspan="2" align="center" bgcolor="#e9e8e8" class="darkblue text-center" style="padding:7px"><b>Shipping cost</b><b></b></td>'+ 
             '<td width="24%" bgcolor="#e9e8e8" class="darkblue text-center" style="padding:7px"><b>Service used</b></td>'+ 
             '<td width="16%" bgcolor="#e9e8e8" class="darkblue text-center" style="padding:7px"><b>Estimated shipping time</b></td>'+ 
            '</tr>'+ 
           '</table>'; 



      var shippingDtl = data.data.service_name == "Any Other" ? data.data.service_any:data.data.service_name; 

      var tr = '<tr id="rowShippingDetails'+data.data.id+'">'+ 
         '<td bgcolor="#FFFFFF" style="padding:7px" class="text-center">'+data.data.country_name+'</td>'+ 
         '<td bgcolor="#FFFFFF" style="padding:7px" class="text-center"><span class="font2a1">For one quantity</span><br />'+data.data.cost_1_qty+'</td>'+ 
         '<td bgcolor="#FFFFFF" style="padding:7px" class="text-center"><span class="font2a1">Each additional qty.</span><br />'+data.data.cost_many_qty+'</td>'+ 
         '<td bgcolor="#FFFFFF" style="padding:7px" class="text-center">'+shippingDtl+'</td>'+ 
         '<td bgcolor="#FFFFFF" style="padding:7px" class="text-center">'+data.data.shipping_time+' day(s)</td>'+ 
         '</tr>';   

      $('#shippingRateDisplay').append(conShip); 
      $('#shippingDetails').append(tr); 
     } 

     }, 'json'); 
    }); 
}); 

此代碼基本上取送貨細節在下拉選擇全國上下的並將其顯示在表格中。該表有兩行，第一行具有列標題（如國家，費率，出貨類型等），第二行顯示從服務器返回的發貨數據。

更清潔器的代碼，如果刪除了表頭和行創建代碼將是：

//select the shipping country to display its shipping rate 
    $('#country').change(function() { 

    if($(this).val() == ""){ 
      $('#shippingRateDisplay').html('<br /><span style="margin-left:8px">No country selected.</span>'); 
      return false; 
     } 
     alert("Before ajax start"); 
    $.post('ajax_utility/getShippingCostProdDtls/', { country_id: $(this).val(), 
                 product_id: <?php echo $this->uri->segment(3); ?>, 
                 current_currency: '<?php echo $product->currency->cur_id; ?>'}, function(data){ alert("Successful ajax, but chrome is not reaching here"); 

     if(data.status != 1){ 
       $('#shippingRateDisplay').html("Shipping rate not set for the specified country"); 
      } 
     else{ 
      $("#shippingRateDisplay").html(""); 

      var conShip = 'THE_TABLE_HEADER'; 



      var shippingDtl = data.data.service_name == "Any Other" ? data.data.service_any:data.data.service_name; 

      var tr = 'THE SHIPPING ROW CREATED WITH THE JSON DATA';   

      $('#shippingRateDisplay').append(conShip); 
      $('#shippingDetails').append(tr); 
     } 

     }, 'json'); 
    }); 
}); 

一個從服務器的一般反應是：

{ 
    "data":{ 
     "id":"4e6a274043ca1", 
     "product_id":"131315437838", 
     "country":"60", 
     "cost_1_qty":"$ 5.00 CAD", 
     "cost_many_qty":"$ 5.00 CAD", 
     "service_used":"7", 
     "service_any":"", 
     "shipping_time":"5", 
     "country_name":"French Guiana", 
     "service_name":"Express\/Expedited International Shipping" 
    }, 
    "status":1 

}

的這個代碼問題是在IE和FF中工作正常，但在Chrome中有奇怪的行爲。 問題是，它在前幾次運行良好，然後它不能。我重新啓動了我的機器和xampp，然後再次出現相同的行爲，當我從下拉菜單中選擇一個國家並從第二次沒有響應時，它第一次顯示出貨表。 我檢查了chrome firebug調試器，發佈的請求成功，並返回了一個200 ok響應和json數據。但它未能觸發第二個警報，這意味着它沒有進入回調函數（如果請求成功則執行該函數）。

另外我只是提到我沒有設置從服務器返回的響應的內容類型。它的文字/ html。

以下是請求和響應頭

responseHeaders響應

Date: Sun, 11 Mar 2012 14:48:34 GMT 
X-Powered-By: PHP/5.2.1 
Connection: Keep-Alive 
Content-Length: 282 
Pragma: no-cache 
Last-Modified: Sun, 11 Mar 2012 14:48:34 GMT 
Server: Apache/2.2.4 (Win32) DAV/2 mod_ssl/2.2.4 OpenSSL/0.9.8d mod_autoindex_color PHP/5.2.1 
Content-Type: text/html 
cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0 
Keep-Alive: timeout=5, max=99 
Expires: Thu, 19 Nov 1981 08:52:00 GMT 

RequestHeaders

Content-Type: application/x-www-form-urlencoded 
X-Requested-With: XMLHttpRequest 
Accept: application/json, text/javascript, */* 

爲什麼沒有被執行的回調函數任何幫助，後阿賈克斯呼籲，因此航運表沒有顯示將是非常有幫助的。謝謝。

UPDATE： 我更新的代碼使用$阿賈克斯，下面是我的代碼：

$.ajax({ type: "post",
url: 'ajax_utility/getShippingCostProdDtls/',
timeout : 5000,
data: { country_id: $(this).val(),
product_id: '<?php echo $this->uri->segment(3); ?>',
current_currency: '<?php echo $product->currency->cur_id; ?>'},
dataType: "json",
success: displayShippingTable,
error: AjaxFailed
});

` 功能AjaxFailed（結果）{
警報（ 「失敗：」 + result.status +''+ result.statusText）;
alert（result.responseText）;
// displayShippingTable（result.responseText）;

} 

`

這工作正常，在Firefox和IE，但對鉻的陌生人比以前。 當我選擇或改變一個國家在航運降了下來，控制檯首先說

POST ajax_utility/getShippingCostProdDtls/200 OK 108ms

再經過5秒超時，它說

POST ajax_utility/getShippingCostProdDtls/Aborted 108ms

然後它進入AjaxFailed函數並給出警報FAILED：200 OK 和json數據r從服務器剔除

如果有人能夠幫助我理解發生了什麼，併發生了什麼，這將是美好的。謝謝。

Answer 1

好的，終於我自己解決了。那麼不完全解決。 我忘了在這裏提到的一件重要的事情是我正在使用的應用程序是使用jQuery 1.3.2。我想好了，讓我們使用最新的jQuery爲這個頁面，以便我可以嘗試promise interface.

而當我通過包含jquery jquery-1.7.1.min.js運行該頁面時，問題立即消失。航運表正在加載非常好。所以我想這是由於jQuery版本和Chrome之間的錯誤或不兼容。就我而言，升級jQuery版本解決了這個問題。