我有两个相同的HTML页面( index.html 和 page1.html ),其中包含两个按钮:
<ul data-role="listview" data-inset="true" class="ui-listview ui-listview-inset ui-corner-all ui-shadow">
<li class="ui-body ui-body-b ui-li-static ui-body-inherit ui-last-child">
<fieldset class="ui-grid-a">
<div class="ui-block-a">
<button id="submit" type="submit" class="ui-btn ui-btn-a ui-corner-all">Submit</button>
</div>
<div class="ui-block-b">
<button id="cancel" data-direction="reverse" type="submit" class="ui-btn ui-btn-a ui-corner-all">Cancel</button>
</div>
</fieldset>
</li>
</ul>
一个按钮变为第二个页面,第二个按钮就像一个后退按钮。 (理想情况下,您可以使用第一个按钮进入第二页,然后使用第二页上的后退按钮返回第一页。)
我使用JavaScript控制它(这仅适用于 index.html 按钮,但 page1.html JS相同):
$(document).on('click', '#submit', function() {
$(":mobile-pagecontainer").pagecontainer("change", "page1.html", {
transition: 'slide',
changeHash: true
});
});
$(document).on('click', '#cancel', function() {
parent.history.back();
//$.mobile.back();
});
但我尝试的任何东西似乎都无效。我知道程序到达parent.history.back();
因为我在控制台中设置了断点,但除此之外我不知道为什么它不会返回到第一页。
答案 0 :(得分:14)
history
是来自window
对象的属性,而不是来自html元素的属性。所以,这应该有效:
window.history.back();
而不是:
parent.history.back();
最后你应该有这样的东西:
$('button#cancel').on('click', function(e){
e.preventDefault();
window.history.back();
});
这也会阻止submit button
答案 1 :(得分:1)
你的取消按钮仍然是一个提交按钮,所以它会返回然后提交表格,再向前发送你,并基本上撤消你的后退机动。
使用
return false;
在parent.history.back();
之后停止继续提交
答案 2 :(得分:0)
这对我来说总是有用的。
<a href="javascript:history.back()">BACK</a>
答案 3 :(得分:0)
使用此:
window.history.back();
答案 4 :(得分:0)
点击时
<a onclick="window.history.back();" class="btn btn-sm btn-info">back</a>
答案 5 :(得分:0)
此代码段可根据用户的最后一页来模拟后退按钮
$(document).ready(function(){
$('a.back').click(function(){
parent.history.back();
return false;
});
});