jQuery mobile将页面加载到DOM中，即使我不要求这样做也是如此 [英] jQuery mobile loads a page into DOM even when I don't ask it to

问题描述

这是场景:

(仅供参考，当我说"window.location = ..."时，它是通过点击按钮触发的)

(fyi, in the following, when I say 'window.location=...' it is triggered by a button tap)

我有三个页面:1.html，2.html，3.html.我按以下方式导航:

I have three pages: 1.html, 2.html, 3.html. I navigate following way:

1.html --- window.location="2.html" ---> 2.html

1.html --- window.location="2.html" ---> 2.html

2.html --- <a href="3.html" /> ---> 3.html

2.html --- <a href="3.html" /> ---> 3.html

        click Back button

2.html--window.location="1.html"-> 1.html

2.html --- window.location="1.html" --> 1.html

在最后一个步骤中，1.html加载了，但是随后将2.html的内容加载到了DOM内，替换了1.html的内容，所以我使用的是1.html，但请参阅2.html的内容.

In last step 1.html loads but then contents of 2.html are loaded inside the DOM replacing contents of 1.html so I'm on 1.html but see contents of 2.html.

发生了什么事?为什么 jQuery mobile 认为它必须加载2.html的内容?

What is happening? Why does jQuery mobile think that it has to load contents of 2.html?

我很确定这与历史记录和后退"按钮有关.如果我不使用后退"按钮而仅在1.html和2.html之间导航，则可以使用.

I'm pretty sure it has to do with history and Back button. If I just navigate between 1.html and 2.html without using Back button, it works.

更新，这是代码 http://jsfiddle.net/x6bxN/要重现，您需要从HTML框中获取代码并将其分成三个单独的文件.

update Here is code http://jsfiddle.net/x6bxN/ To reproduce you'll want to take code from HTML box and separate it into three separate files.

推荐答案

正在发生的事情是您正在导航到jQM的范围之外，但是1.html在location.hash中.

What looks to be happening is you're navigating outside the scope of jQM, but 1.html is in location.hash.

与点击无关的哈希更改，例如当用户 单击后退按钮，通过hashchange事件进行处理， 使用Ben Alman的hashchange绑定到window对象 特殊事件插件(包含在jQuery Mobile中).当哈希值更改时 发生时(以及第一页加载时)，hashchange事件 处理程序会将location.hash发送到$ .mobile.changePage() 功能，然后加载或显示所引用的页面.

Hash changes that occur independently of a click, such as when a user clicks the back button, are handled through the hashchange event, which is bound to the window object using Ben Alman's hashchange special event plugin (included in jQuery Mobile). When a hash change occurs (and also when the first page loads), the hashchange event handler will send the location.hash to the $.mobile.changePage() function, which in turn either loads or reveals the referenced page.

我假定location.hash在加载时具有初始1.html，但在使用window.location导航到新页面时不会跟踪新页面.由于您使用的是浏览器后退按钮，因此jQM使用的是上一个跟踪的位置(在您的情况下为1.html).

I assume location.hash has the initial 1.html when it loads but doesn't track the new page while using window.location to navigate to a new page. Since you are using the browser back button jQM uses the last tracked location which in your case is 1.html.

如果您需要跟踪位置，我建议使用jQM的$.mobile.changePage(). 可以在文档中找到有关jQM导航的更多信息:

I would suggest using jQM's $.mobile.changePage() if you need to track the location. More on jQM Navigation can be found in the docs:

• http://jquerymobile.com/demos/1.0rc1/docs/pages/page-navmodel.html
• http://jquerymobile.com/demos/1.0rc1/docs/api/events.html
• http://jquerymobile.com/demos/1.0rc1/docs/api/methods.html

• http://jquerymobile.com/demos/1.0rc1/docs/pages/page-navmodel.html
• http://jquerymobile.com/demos/1.0rc1/docs/api/events.html
• http://jquerymobile.com/demos/1.0rc1/docs/api/methods.html

这篇关于jQuery mobile将页面加载到DOM中，即使我不要求这样做也是如此的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！