Javascript 为什么我必须在jquery mobile中将所有脚本放在index.html中
我使用$.mobile.changepage在我的phonegap+jquerymobile项目中执行重定向。然而，让我感到困惑的是，我需要将所有页面的脚本放在同一个文件index.html中。否则，重定向页面将无法执行其标题中的函数 例如，my index.html似乎是Javascript 为什么我必须在jquery mobile中将所有脚本放在index.html中,javascript,jquery,html,cordova,jquery-mobile,Javascript,Jquery,Html,Cordova,Jquery Mobile,我使用$.mobile.changepage在我的phonegap+jquerymobile项目中执行重定向。然而，让我感到困惑的是，我需要将所有页面的脚本放在同一个文件index.html中。否则，重定向页面将无法执行其标题中的函数 例如，my index.html似乎是 $（document.bind（“deviceready”，function（）{$.mobile.changepage（“test.html”）；}） 然后，我的设备将重定向到test.html，它似乎是 $("#btnT
$（document.bind（“deviceready”，function（）{$.mobile.changepage（“test.html”）；}）$("#btnTest").click(function(){alert("123");})
<button id="btnTest">Test</button>
$（“#btnTest”）。单击（函数（）{alert（“123”）；}）
试验
但是，脚本永远不会在test.html中执行。然后我将脚本放在index.html中，我所期望的就是完成。不管怎样，如果我把所有脚本放在同一个页面上，项目将越来越难以保存。感谢您的帮助。与普通HTML页面不同，jQuery Mobile在页面之间导航时使用ajax技术。因此，请确保在所有html页面中导入所有JS文件和库 如果您仔细观察，您会发现在加载第二个页面时，会考虑上一个页面中的JS文件。但是如果强制刷新当前页面，则当前页面的js文件将生效 因此，正如我前面所说的，请确保在所有html文件中导入js文件 也无需调用
devicerady$(document).on('pageshow', '#YourPageID', function(){
// Your code goes here
});
jquerymobile使用ajax加载“页面”。这里的“页面”是一个div，数据角色=页面。如果加载物理页面index.html，则可以使用changePage导航到该页面内的任何“页面”div 但是，如果要从其他物理页面加载“页面”，jQM将只从该页面加载第一个“页面”div。实际发生的情况是，您不需要更改页面，jQM只需使用ajax加载特定的“页面”div，并将其注入到当前页面 您有两种可能的架构，将所有“页面”放在一个html页面中，然后从那里导航。或者您可以使用多页架构。你可以随时混合这个 要实际更改页面，您需要在链接中添加rel=external。Intro 这篇文章也可以在我的博客中找到 jQuery Mobile如何处理页面更改 要了解这种情况，您需要了解jQuery Mobile是如何工作的。它使用ajax加载其他页面 第一页正常加载。它的
头部主体DOM正文DOM车身正文中有更多的页面，也只会加载第一个页面。此规则仅适用于后续页面，如果初始HTML中有更多页面，则将加载所有页面
这就是为什么按钮显示成功，但单击事件不起作用。相同的单击事件，其父项标题在页面转换期间被忽略
以下是官方文件：
不幸的是，您不会在他们的文档中找到这些描述。他们是否认为这是一个常识，或者他们忘记像我的其他主题一样描述这一点。（jQuery移动文档很大，但缺少很多东西）
解决方案1
在第二页和每隔一页中，将脚本
标记移动到正文
内容中，如下所示：
<body>
<div data-role="page">
// And rest of your HTML content
<script>
// Your javascript will go here
</script>
</div>
</body>
最后，我将描述为什么这是一个好的解决方案的一部分
解决方案3
在按钮和用于更改页面的每个元素中使用rel=“external”。正因为如此，ajax不会用于页面加载，您的jQuery移动应用程序的行为将类似于普通的web应用程序。不幸的是，对于您的情况，这不是一个好的解决方案。Phonegap不应作为普通的web应用程序使用
<a href="#second" class="ui-btn-right" rel="external">Next</a>
官方文档，查找章节：
现实的解决方案
实际解决方案将使用解决方案2。但与解决方案2不同，我将使用相同的index.js文件，并在每个可能的其他页面的标题中初始化它
现在你可以问我为什么
Phonegap
像jQuery Mobile一样有缺陷，如果你的每个js内容都在一个HTML文件中，迟早会出现错误，你的应用程序将失败（包括加载的DOM）。DOM可能会被删除，Phonegap
将刷新当前页面。如果该页面没有javascript，则在重新启动之前将无法工作
最后的话
使用良好的页面架构可以轻松解决此问题。如果有人感兴趣，我已经写了一篇关于好的jQuery移动页面架构的。简单地说，我正在讨论的是，了解jQuery Mobile的工作原理是成功创建第一个应用程序之前需要知道的最重要的事情。这是一个非常完美的答案！所以我们的结论是，我们不能将每个js文件分割成每个页面？这使得我们的应用程序很难保存。我担心这是否意味着javascript错误会使整个应用程序因JqueryMobile而崩溃。在解决方案1中，包含外部脚本文件是否如此丑陋？这当然不是一个坏主意，我更喜欢将所有内容都包含在外部文件中。@Gajotres解决方案中的什么东西如此丑陋#1？天哪，如果我先读了这篇文章，我本可以避免头发拉扯，谢谢你，伙计！
<a href="#second" class="ui-btn-right" rel="external">Next</a>