大家好，

現在我第四次嘗試在Rails應用中實現history.js。我有一種方法運行得很好，但代碼太難看了。今天我又看了一遍代碼並思考：我怎樣才能讓這個更好，更容易，更幹？？如何以正確的方式在rails中執行history.js？

我迄今所做的（和工作相當好，不完美）：

設置remote: true到我的鏈接
jQuery的UJS取的js.erb

我的HTML看起來像：

<body> 
    <div id="content"> 
    some content with buttons, etc. 
    </div> 
</body>

該js.erb包含：

History.pushState(
    { 
    func: '$(\'#content\').html(data);', 
    data: '<%= j(render template: "news/index", formats: [:html]) %>' 
    }, 
    'test title', 
    '<%= request.url %>' 
);

然後history.js需要的功能，並賦予它的數據。所以它用新生成的代碼替換content -div。並且它也更新了URL。這個代碼我必須放在每個（！）js.erb文件中。

我最後的想法，使其少一點醜陋分別爲：

設置remote: true到我的鏈接
當一個鏈接被點擊它提取一些js.erb它取代了content -div
所有鏈接與data-remote="true"將得到ajax:success處理程序
在ajax:success新的URL被推送到history.js

但內部仍然存在一個問題。然後，我有JavaScript代碼：

$(document).on('ajax:success', 'a[data-remote="true"]', function() { ... });

的問題是：ajax:success永遠不會觸發如果我更換div -tag其中鏈路（即應觸發事件）是

也許有人可以解決我的問題...

或者還有更好的方法嗎？

來源

2012-04-10 Benjamin M

你見過jquery.pjax？ – 2012-04-10 21:33:54

我已經看了很多次histoy.js頁面，但從未嘗試過嘗試實際嘗試它。我很想看到這個問題以一種明確的方式回答。 – Ashitaka 2012-04-10 21:48:30

PJAX僅適用於HTML5。 HTML4瀏覽器只是得到正常的鏈接...隨着history.js我們也得到AJAX的HTML4瀏覽器 – 2012-04-11 05:07:48

-2

你試過turbolinks？這將是Rails的4

來源

2013-06-16 10:27:56 roryhughes

默認什麼：

History.Adapter.bind(window, 'statechange', function() { 
    var state = History.getState(); 
    ... 
});

來源

2013-08-07 14:25:50

我使用beforeSend事件爲全球聽衆對所有數據的遠程更改處理瀏覽器的歷史記錄。我更喜歡beforeSend，因爲我希望鏈接在被單擊後立即更改，而不管ajax請求的結果如何。

$(document).bind('ajax:beforeSend', function(event,data){ 
    history.pushState(null, '', event.target.href) 
});

這解決了您的問題，因爲事件在對DOM做任何修改之前被觸發。

來源

2013-09-10 22:40:00

我只使用jquery-ujs和pushState，popState。

這裏見我的回答：

https://stackoverflow.com/a/27532946/345996

來源

2014-12-17 19:08:44 jogaco

如何以正確的方式在rails中執行history.js？

大家好，

我迄今所做的（和工作相當好，不完美）：

我最後的想法，使其少一點醜陋分別爲：

或者還有更好的方法嗎？

回答

相關問題