2012-02-22 51 views
1

我有很多問題試圖找到爲什麼我的AJAX函數不適用於Safari,Chrome和有時Firefox,但在IE上工作得很好的原因。我做了一些改變,一切都開始工作完美(在每個瀏覽器中),但我仍然不知道爲什麼,我想找出造成這種情況的主要原因。阿賈克斯不與Href(解決方案)

我有一個Ajax函數respuestas()它在數據庫中插入一些數據。這個功能被這樣的一些鏈接調用:<a onclick="respuestas()" href="link.html">LINk </a>。所以當我點擊鏈接時,函數會獲取正確的信息並將其插入到數據庫中,然後轉至link.html。再次,這隻適用於IE。

我插入一個alert(xml.responseText)來查看我的回覆。 Safari,fireforx和chrome返回一個空警報。

每當我想測試我的功能,我厭倦了改變頁面,所以我添加了一個按鈕調用我的功能(無需轉到另一個網頁)和IT工作!現在,我有這樣的東西:<a onclick="respuestas()" href="#">LINK </a>並把window.location.href="link.html"放在我的ajax函數中,所以頁面的變化發生在ajax響應完成之後,並且它工作得很好。

但我不完全明白爲什麼這個工作,而另一種方式沒有。

回答

5

這是因爲link元素也是默認偵聽器。所以,爲了防止任何額外的點擊操作,您應該防止默認操作。這樣做的簡單方法是在點擊後返回false。

<a onclick="respuestas(this); return false;" href="link.html">LINk</a> 

而且在最簡單的方法你respuestas應該是這樣的:

function respuestas(link) { 

    /* do what you need here */ 

    window.location.href = link.href; 
} 

這是很原始的,但我相信你會明白我的意思。

+0

但是爲什麼效果很不錯的IE瀏覽器,而不是在其他瀏覽器? – mauguerra 2012-02-22 17:11:00

+3

@mauguerra因爲IE總是做不同於其他符合標準的瀏覽器。這只是網絡開發的一個規則。 – danyim 2012-02-22 19:46:16

1

這裏發生了什麼事情,您的瀏覽器正在導航到下一頁,然後repusetas()才能夠執行。爲了確保腳本在瀏覽器跟隨鏈接之前觸發,您需要控制點擊事件。在jQuery中它的工作原理是這樣的:

$('a').bind('click', function(event){ 
    event.preventDefault(); 
    repuestas(); 
    var href = $(this).attr('href'); 
    window.location.href = href; 
}); 
+0

但爲什麼它在IE上運行得非常好,而不是在其他瀏覽器上運行? – mauguerra 2012-02-22 17:11:44

1

試試這個jQuery代碼

function respuestas() 
{ 
$.ajax({ 
     type: "post", 
     url: "insert.php?data="+data, 

     success : function(data){ 
      window.location.href="link.html"; 
     }, 
     error : function(){ 
      alert("Could not "); 
     } 

     }); 

}