需要刷新jQuery Mobile中的页面 [英] need to refresh page in jquery mobile

问题描述

jquery mobile面临一些问题. 当我从第一页移至第二页时，它不会显示第二页，因为我应该每次都刷新我的页面.最初似乎缺少一些CSS类.我不明白为什么会这样.

我正在使用 http://code.jquery.com /mobile/1.0/jquery.mobile-1.0.min.css 作为CSS

http://code.jquery.com/jquery-1.6.4. min.js

http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js 作为JS.

在同一页面上，我有这个定位标记

<a href="" onClick="showText()">showText</a>

showText()方法不会首次调用，并显示未定义javascript错误showText，但是当我刷新页面时，它可以正常工作.

解决方案

关于 showText():

您必须了解JQM的工作方式.为了启用过渡等功能，JQM引入页面并将其拖放到DOM中.您从第一页(属于BasePage)开始，该页面已完全加载了所有.js/.css文件并得到了增强.

加载第二页时，JQM仅抓取 data-role ="page" id ="your-2nd-page" 中的内容，并将其添加到DOM中！ JQM将

NOT 捕获此div标签之外的所有脚本以及第二页标题中的所有.css和.js文件.

因此，如果showtext()函数位于页面div之外的第二页上或仅在第二页中使用的.js文件中，则它将不会被抓取并注入到DOM中，因此您的函数不会工作.

刷新第二页时，第二页将成为完全增强的BasePage，因此将加载第二页上的所有脚本，但是现在第一页上的所有脚本将无法使用，如果您加载第一页.

解决方案::我将所有CSS/脚本都放在所有页面中.这样，无论用户从哪里开始，都将加载所需的所有内容.

I am facing some issues with jquery mobile . When I move from my first page to second page it does not show the second page as it should be I need to refresh my page every time. It seems like its missing some CSS classes initially. I don't understand why is this happening.

I am using http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css as CSS

http://code.jquery.com/jquery-1.6.4.min.js

http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js as JS.

On the same page I have this anchor tag

<a href="" onClick="showText()">showText</a>

showText() Method does not call first time and shows javascript error showText not defined but when I refresh the page it works fine.

解决方案

Regarding showText():

You have to understand how JQM is working. In order to enable transitions et al, JQM pulls in and drops pages into the DOM. You start with your first page (sort of your BasePage), which is fully loaded with all .js/.css files and enhanced.

When you load the 2nd page, JQM only grabs what's inside data-role="page" id="your-2nd-page" and adds this to the DOM after your first page! All scripts outside this div-tag as well as all .css and .js files in the header of the 2nd page will NOT be grabbed by JQM.

So, if your showtext() function is on the 2nd page outside of the page div or in a .js file only used in the 2nd page, it will not be grabbed and injected into the DOM, so your function does not work.

When you refresh your 2nd page, the 2nd page will be your fully enhanced BasePage, so all scripts on the 2nd page will be loaded, BUT now all scripts on the first page will not work, if you load the first page.

Solution: I'm putting all css/scripts in all pages. That way no matter where the user starts, everything needed is loaded.

这篇关于需要刷新jQuery Mobile中的页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！