我正在RoR 中做一个项目。该项目位于 iFrame 内。在该 iframe 中有前进和后退按钮。当我单击后退按钮时,iframe 内容应该返回,而不是整个浏览器页面。我在用 ”历史.js“插件。但我不知道怎么用。
我的代码是这样的:
$('#back-btn').on('click', function () {
History.back();
});
$('#forward-btn').on('click', function () {
History.forward();
});
$("a").click(function () {
n = 1;
q = n++;
var s = $(this).attr("href");
var o = 'History.pushState({state:' + q + ',rand:Math.random()}, "State 1", \"' + s + '\");'
$("#z").empty().append('<button onclick=\'javascript:' + o + '\'>sds</button>');
$("#z button").click();
//this is for checking log
(function (window, undefined) {
var
History = window.History, // Note: We are using a capital H instead of a lower h
State = History.getState(),
$log = $('#log');
// Log Initial State
History.log('initial:', State.data, State.title, State.url);
// Bind to State Change
History.Adapter.bind(window, 'statechange', function () { // Note: We are using statechange instead of popstate
// Log the State
var State = History.getState(); // Note: We are using History.getState() instead of event.state
History.log('statechange:', State.data, State.title, State.url);
});
})(window);
})
注意:有时我会使用ajax调用。
感谢您的支持。
你可能喜欢使用window.history
object
iframe.contentWindow.history.go(-1); // back
iframe.contentWindow.history.go(1); // forward
所以你的后退按钮可以修改为\
$('#back-btn').on('click', function () {
iframe.contentWindow.history.go(-1);
or
iframe.contentWindow.history.back();
});
并且您的前进按钮可以修改为
$('#forward-btn').on('click', function () {
iframe.contentWindow.history.forward();
or
iframe.contentWindow.history.go(1);
});
Cheers !
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)