Jquery Mobile:“pageshow”事件仅在 Shift F5(完全重新加载)时触发,但在加载另一个页面或具有不同查询的同一页面时不会触发
Posted
技术标签:
【中文标题】Jquery Mobile:“pageshow”事件仅在 Shift F5(完全重新加载)时触发,但在加载另一个页面或具有不同查询的同一页面时不会触发【英文标题】:Jquery Mobile: 'pageshow' event fired only at Shift F5(full reload), but not fired when loading another page or same page with different query 【发布时间】:2012-06-25 10:28:06 【问题描述】:这是我的page.html
的架构:
<head>
<script... jquery
<script... jquery.mobile
<scripts... imagemapster, autocomplete, etc...
</head>
<body>
<div page1..
</div>
<div page2..
</div>
<my script with functions and initializations...
</body>
在我的<script>
中,有一些绑定到page1.pageshow
事件。当我直接加载整个页面时,确保第一次加载所有脚本,我的脚本也正确加载并且没有任何缺陷。即使从page2
回到page1
,也会触发事件。
但是,当我转到另一个页面或使用 JM 内置 ajax 函数刷新同一页面时,我的脚本未加载,或者 page1
上的 pageshow
未触发。
我尝试将脚本放在page1
的末尾或放在头部,但它仍然无法重新加载。我也不能将它放在涉及的任何 div 之前(所有页面中的许多标签都附加了一些事件)-因为不仅pageshow
错过了,而且ready
和pageload
也错过了。
抱歉,我无法显示整个代码,但您会以哪种方式工作并寻求找出问题所在?
【问题讨论】:
试试this jsfiddle,了解如何正确使用pageshow事件。 它是单页应用(html 文件,不是 jqm 页面),还是您从另一个 html 页面导航到page.html
?
你是如何绑定到pageshow
的?使用.bind()
或.on()
?我在使用 .bind()
时遇到了问题。请注意,.on()
工作得更好。
当您说“...当我转到另一个页面...”时,您的意思是您转到了一个在 page.html
之外定义的页面,当您返回时,您的问题就会出现。对吗?
【参考方案1】:
您在此处的脚本只会在文档加载时触发一次
<head>
<script... jquery
<script... jquery.mobile
<scripts... imagemapster, autocomplete, etc...
</head>
<body>
<div page1..
<script with the (page1).on(pageshow event handler)>
</div>
<div page2..
<script with the (page2).on(pageshow event handler)>
</div>
<script here fired only once at document load>
</body>
您非常错误地认为每次页面转换都会触发它,因为您使用一个页面来包含所有实际页面。 通常,每个页面脚本都在 div[data-role=page] 中编码。 确保您使用页面 id 作为每个内联 pageshow 事件处理程序的选择器。
【讨论】:
@user1475428 是否在问题中使用 .bind 和 .on 都没有关系,因为这不是问题的根本原因以上是关于Jquery Mobile:“pageshow”事件仅在 Shift F5(完全重新加载)时触发,但在加载另一个页面或具有不同查询的同一页面时不会触发的主要内容,如果未能解决你的问题,请参考以下文章
Jquery Mobile:“pageshow”事件仅在 Shift F5(完全重新加载)时触发,但在加载另一个页面或具有不同查询的同一页面时不会触发