預加載懸停頁面並點擊鏈接

Question

我正在玩一個預覽頁面的可能性，使用ajax將鼠標懸停在按鈕上，並且點擊此按鈕可以更快地獲得此頁面。我一開始並沒有真正找到一個好的解決方案，可能是完全錯誤的。這裏是我試過的，看起來像一個小小的promissing對我來說：

document.getElementById('link').addEventListener('mouseover',function() { 
    var r = new XMLHttpRequest(); 
    r.open("POST", "index.php", true); 
    r.onreadystatechange = function() { 
     if (r.readyState != 4 || r.status != 200) return; 
     document.getElementById('link').addEventListener('click',function() { 
      window.location.assign('index.php'); 
     }); 
    }; 
    r.send(''); 
}); 

但我不認爲這樣做。

有人可以指向我沒有共享代碼/解決方案嗎？我主要感興趣的是如何通過我自己來實現這個目標 - ajax是否是正確的開始？

我正在尋找一個JavaScript的唯一的解決辦法

Answer 1

你需要一點點的底層出來的頁面內容和管理什麼的URL 的框架沒有發送另一個請求到服務器和重裝頁。

Push state可以幫助進行URL操作。

當您通過AJAX從服務器接收到部分HTML時，您需要替換頁面正文（或更少，取決於您的標記，可能只是#container或頁面上的任何內容）。

看看Rails'TurboLinks如何使用稱爲PJAX的方法來快速導航頁面。然後，預取懸停可以在這種方法之上進行分層。

更多閱讀：http://pjax.herokuapp.com/