除非我刷新,否则jQuery mobile中的JavaScript无法正常工作

我有一个内置JavaScript的jQuery移动页面.问题是除非页面刷新,否则JavaScript不起作用.这是我的代码：

jQuery(function($) {
    var url = window.location.search.substring(1);
    $('#mydiv').load('real_news.asp?' + url);
});

解决方法

要理解这个问题,您需要了解jQuery Mobile的工作原理.

您的第一个问题是您尝试初始化JavaScript的问题.根据您之前的答案,我可以看到您正在使用多个HTML / ASP页面,并且您的所有javascript都是从页面< head>初始化的.这是主要问题.只有第一个HTML文件应该将JavaScript放入< head>内容.当jQuery Mobile将其他页面加载到DOM中时,它只加载< div>使用data-role =“page”属性.其他所有内容,包括< head>,都将被丢弃.

这是因为当前加载的页面具有< head>已经.加载其他页面没有意义< head>内容.这甚至更进一步.如果第二个HTML文件中有多个页面,则只会加载第一个页面.

我不会尝试在这里发明温水,所以这里是我讨论这个问题的其他2个答案的链接.可以在那里找到几种解决方案：

> Why I have to put all the script to index.html in jquery mobile(或this blog article)
> Link fails to work unless refreshing

那里有足够的信息可以让你知道该怎么做.

这个问题的基本解决方案是：

>将所有JavaScript放入第一个HTML / ASP文件中
>将您的JavaScript移动到< body&gt ;;更确切地说,将其移动到< div> with data-role =“page”.正如我已经指出的那样,这是将要加载的页面的唯一部分.
>在页面之间切换时使用rel =“external”,因为它将触发整页刷新.基本上,你jQuery mobile认为该页面将充当普通的Web应用程序.

作为Archer pointed out,您应该使用页面事件来初始化您的代码.但是,让我告诉你更多关于这个问题的信息.与传统的普通网页不同,在使用jQuery Mobile时,文档就绪通常会在页面在DOM内完全加载/增强之前触发.

这就是创建页面事件的原因.有几个,但如果您希望您的代码只执行一次(如文档就绪),您应该使用pageinit事件.在任何其他情况下使用pagebeforeshow或pageshow.

如果您想了解有关页面事件的更多信息以及为什么要使用这些事件而不是文档准备,请在我的个人博客上查看此article.或者找到它here.