我想将脚本添加到 jquery mobile 的外部页面而不是 home 文件(调用 jquery mobile 的源代码的地方)。这是我的两个文件的代码
index.php里面的代码
<head>
<title>My Web Application</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0;" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<link rel="stylesheet" href="view/css/mobile.css" />
<link rel="stylesheet" href="view/css/reset.css" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<script type="text/javascript" src="view/js/light.js"></script>
</head>
<body>
<div data-role="page" class="page">
<div data-role="header" id="index-header" data-theme="b">
<div id="logo">
<a href="#"><img src="view/images/Milan.png" alt="logo" height="80"></a>
</div>
</div>
<div id="color-bar"></div>
<div data-role="content">
<ul data-role="listview" data-inset="true" data-theme="b">
<li><a href="#" title="theme"><img src="view/images/1.png" />Security</a></li>
<li><a href="light.php" title="calendar"><img src="view/images/2.png" />Info</a></li>
<li><a href="light.php" title="theme"><img src="view/images/3.png" />Lighting</a></li>
<li><a href="light.php" title="calendar"><img src="view/images/4.png" />Comfort</a></li>
<li><a href="light.php" title="theme"><img src="view/images/5.png" />Music</a></li>
<li><a href="light.php" title="calendar"><img src="view/images/6.png" />Media</a></li>
</ul>
</div><!-- /content -->
</div><!-- /page -->
</body>
在这里，点击我的 anchor 标记，页面将被重定向到 light.php。在 light.php 中，我无法添加任何外部脚本。如果我想在 light.php 中使用任何脚本，它希望我将它添加到 index.php 中。但我想在 light.php 中添加我的脚本并使其仅针对 light.php 运行。这就是我想在 light.php 中添加的脚本
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
window.location = "index.php?page=lighting";
}, 1000);
</script>
当我刷新我的 light.php 文件时，脚本似乎可以工作，但我想让它在不刷新的情况下工作。
最佳答案
jQuery Mobile 如何处理页面变化
要了解这种情况，您需要了解 jQuery Mobile 的工作原理。它使用 ajax 加载其他页面。
第一页正常加载。它的 HEAD 和 BODY 被加载到 DOM>，他们在那里等待其他内容。当加载第二个页面时，仅其BODY 内容被加载到DOM .
这是官方文档:http://jquerymobile.com/demos/1.2.0/docs/pages/page-links.html
不幸的是，您不会在他们的文档中找到这个描述。以太他们认为这是常识，或者他们忘记像我的其他主题一样描述这一点。 (jQuery Mobile 文档很大但缺少很多东西)。
解决方案:
在您的第二个页面和所有其他页面中，将您的
SCRIPT标记移动到BODY内容，像这样:将所有 javascript 移动到原始的第一个 HTML 中。收集所有内容并将其放入单个 js 文件中，放入
HEAD中。在加载 jQuery Mobile 后对其进行初始化。在您的按钮和用于更改页面的每个元素中使用 rel="external"。因此，ajax 不会用于页面加载，您的 jQuery Mobile 应用程序将像普通的 Web 应用程序一样运行。
更多信息
关于jquery - 将脚本添加到 jquery mobile 中的外部页面而不是主文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17590806/