jQuery 移动 data-rel="back"导致触发错误事件的链接
查看 测试用例
打开链接时 ，第 1 页 的 pagebeforeshow 被触发。当您单击链接转到第 2 页时，将触发第 2 页的 pagebeforeshow。到目前为止，一切都很好。
如果您随后使用左侧按钮 (data-rel="back") 返回，则会触发多余的事件。使用右侧按钮（直接链接到第 1 页）可以达到我的预期，即，只有 第 1 页 的 pagebeforeshow 被触发。
pagebeforeshow也可以替换为pageshow，没关系。这里发生了什么事？
（在最新版本的 Chrome 中测试）
参考来源：
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js"></script>
<script>
$('#test1').live('pagebeforeshow', function() {
console.log("=== pagebeforeshow for #test1");
});
$('#test2').live('pagebeforeshow', function() {
console.log("=== pagebeforeshow for #test2");
});
</script>
</head>
<body>
<div data-role="page" id="test1">
<div data-role="header" align="center">
<p>Page 1.</p>
</div><!-- /header -->
<div data-role="content">
<p><a href="#test2">Go to page 2.</a></p>
</div><!-- /content -->
</div><!-- /page -->
<div data-role="page" id="test2">
<div data-role="header" align="center">
<a href="/" data-icon="back" data-rel="back">Back</a>
<p>Page 2.</p>
<a href="data-rel-back.html" data-icon="back">Go directly to page 1</a>
</div><!-- /header -->
<div data-role="content">
<p>
Try the two buttons and have a look at the console.<br>
Using the left button (data-rel="back") triggers "too many" events.<br>
The right button does what I'd expect.
</p>
</div><!-- /content -->
</div><!-- /page -->
</body>
</html>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
更改链接以重定向到第 1 页
请
如果您发现删除正斜杠有任何问题，
Please change the link to redirect to page 1
should be
if you find any trouble with this remove forward slash
实时 示例
更正了标题和后退按钮属性中的标签
jQM 在渲染页面时添加额外的标记（如果您使用）错误的标签某些功能可能会改变、中断。我认为后退按钮发生的情况是您还添加了 href="/" 属性，这可能导致 jQM 尝试导航到它并返回到导致问题的最后一页。
同样在标题中，您使用了
标签并将其居中对齐，jQM 在使用时执行此操作有关
后退按钮的更多信息，您可以始终参考文档
Live Example
Corrected tags in header and back button attributes
jQM adds extra markup when rendering the page, if you use the wrong tags some of the functionality might change, break. I think what was happening for the back button is you also added a href="/" attribute and this might have caused jQM to try to navigate to it as well as going back to the last page causing the issue.
Also in the header you had used the
<p>tag and aligned it center, jQM does this when using the<h1>For more on the back button you can always refer to the docs
事实证明，这是 Chrome 控制台中的一个错误。
Chromium bugtracker
Turns out, this is a bug in Chrome's console.
Chromium bugtracker