在JavaScript的jQuery Mobile的不工作，除非我刷新 [英] JavaScript in jQuery mobile not working unless I refresh
问题描述
我在使用JavaScript的内部jQuery Mobile的页面。问题是，JavaScript不工作，除非页面被刷新。这是我的code：
jQuery的（功能（$）{
变种的url = window.location.search.substring（1）;
$（'＃mydiv）的负载（'real_news.asp？+网址）;
}）;
要了解这个问题，你需要了解jQuery Mobile的是如何工作的。
您的第一个问题是一点，你正在试图初始化的JavaScript。从你的previous答案，我可以看到你使用多个HTML / ASP页和所有的JavaScript初始化表页面＆LT; HEAD＆GT; 。这是主要的问题。只有第一个HTML文件应具有的JavaScript放到＆LT; HEAD＆GT; 的内容。当jQuery Mobile的加载其他页面到DOM加载仅＆LT; DIV＆GT; 与数据角色=页面属性。其他一切，包括＆LT; HEAD＆GT; ，将被丢弃。
这是因为当前载入的页面有一个＆LT; HEAD＆GT; 了。在加载其他页面没有一点＆LT; HEAD＆GT; 的内容。这走得更远。如果有多个页面中的第二HTML文件，只有第一个将要被加载。
我不打算在这里创造温水所以这里链接到我的其他2回答讨论这个问题。几种解决方案可以在那里找到：
-
为什么我已经把所有的脚本jQuery Mobile的到的index.html（或<一HREF =http://www.gajotres.net/how-jquery-mobile-page-handling-affects-javascript-executions/>这个博客文章）
还有更多然后足够的信息有，给你一个想法是什么做的。
的基本解决方案，这个问题是：
- 把所有你的JavaScript成第一个HTML / ASP文件
- 将您的JavaScript到
＆LT;身体GT;;更precise，将其移动到＆LT; DIV＆GT;与数据角色=页面。正如我已经指出的那样，这是一个网页，是要被加载的一部分。 - 使用
相对=外部页面之间切换，因为这将引发整个页面刷新的时候。基本上，你的jQuery移动该网页将作为一个正常的Web应用程序。
作为射手<一个href="http://stackoverflow.com/questions/17405013/javascript-in-jquery-mobile-not-working-unless-i-refresh/17405355#17405355">pointed出，你应该使用页面事件来初始化code。但让我告诉你更多关于这个问题的。不同于传统正常的网页，使用jQuery Mobile工作时，文档准备页面之前通常会引发满载/ DOM的内部增强。
这就是为什么创建页面事件。有几个人，但如果你想你的code只执行一次（如在案件的文件准备好），你应该使用 pageinit 事件。在任何其他情况下使用 pagebeforeshow 或 pageshow 。
如果您想了解更多有关页面事件，为什么他们要用来代替文件准备看看这的文章。还是觉得这里。
I'm having a jQuery mobile page with JavaScript inside. The problem is the JavaScript doesn't work unless the page is refreshed. Here is my code:
jQuery(function($) {
var url = window.location.search.substring(1);
$('#mydiv').load('real_news.asp?' + url);
});
To understand this problem you need to understand how jQuery Mobile works.
Your first problem is point where you are trying to initialize JavaScript. From your previous answers I can see you are using several HTML/ASP pages and all of your javascript is initialized form the page <head>. This is the main problem. Only the first HTML file should have JavaScript placed into the <head> content. When jQuery Mobile loads other pages into the DOM it loads only the <div> with a data-role="page" attribute. Everything else, including <head>, will be discarded.
This is because currently loaded page has a <head> already. No point in loading another pages <head> content. This goes even further. If you have several pages in a second HTML file, only the first one is going to be loaded.
I will not try to invent warm water here so here are links to my other 2 answers discussing this problem. Several solutions can be found there:
There's more then enough information there to give you an idea what to do.
The basic solutions to this problem are:
- Put all of your JavaScript into a first HTML/ASP file
- Move your JavaScript into
<body>; to be more precise, move it into a<div>withdata-role="page". As I already pointed out, this is the only part of a page that is going to be loaded. - Use
rel="external"when switching between pages because it will trigger a full page refresh. Basically, you jQuery mobile that the page will act as a normal web application.
As Archer pointed out, you should use page events to initialize your code. But let me tell you more about this problem. Unlike classic normal web pages, when working with jQuery Mobile, document ready will usually trigger before page is fully loaded/enhanced inside the DOM.
That is why page events were created. There are several of them, but if you want your code to execute only once (like in case of document ready) you should use the pageinit event. In any other case use pagebeforeshow or pageshow.
If you want to find out more about page events and why they should be used instead of document ready take a look at this article on my personal blog. Or find it here.
这篇关于在JavaScript的jQuery Mobile的不工作，除非我刷新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
