Jquery mobile：如何调试？答案

【问题标题】：Jquery mobile: how to debug?Jquery mobile：如何调试？
【发布时间】：2012-11-06 19:00:33
【问题描述】：

我想，在我的 jquery 移动页面中，我遇到了一些问题，但我找不到问题所在。 Firebug 不会触发任何错误，甚至不会发出警告。 Chrome 的控制台同上。唯一的症状是我的某些页面（不是全部）无法加载。我只能看到一个圆圈的加载动画一直在自己打开......

一般来说，我有一个索引页面，包含 15 个页面，如下所示：

<div data-role="page" id="page1">
<div data-role="header" class="ui-bar-b">
    <h1>Yea</h1>
</div>
<?php include 'page1.php'; ?>
<?php include 'footer.php'; ?>
</div>

前三个像魅力一样起作用，另一个导致问题。现在每个页面的代码都在一个单独的 php 页面中。我也尝试单独加载其他页面，但没有错误...

我正在使用 jquery mobile 1.1.1 和 jquery 1.7.1。请帮帮我。

【问题讨论】：

关闭 ajax 导航是否一切正常？
我该怎么做？我对 jquery 有点新 ^^'
嗨，试试 jquery 移动文档中的这个页面：jquerymobile.com/test/docs/pages/page-navmodel.html

标签： php debugging jquery-mobile

【解决方案1】：

如果你需要调试，你不应该在每个页面上都有你的 JS，你应该在入口点加载 JS，或者使用 RequireJS 根据你导航到的页面按需加载它们。这样你也可以在你的所有 JS 上设置断点并轻松调试。

如果您在每个页面上包含 JS，它需要在您的 <div data-role="page"/> 标记中，这是因为 jQM 使用 AjAX 加载，并且您的 <head/> 中可能有 JS，它没有被拉入。

如果您在组织 JS 方面需要帮助，请参阅此处：https://stackoverflow.com/a/9368352/737023

【讨论】：

好文章，我会尝试做这样的事情。此时，我将每个页面分开，包含自己的 js 代码并包含在 div 数据角色页面中。可能这是编译器不触发错误的原因？
不确定为什么您没有收到错误，您是说直接加载某些页面不起作用？听起来您只是缺少一个包含或正确的 jQM 容器 - 随意将这些页面之一转储到 jsFiddle
下次我会尝试解决问题，我会立即解决。有时我觉得问题不在页面中，因为如果我尝试在索引中移动整个块 div 数据页面，则移动的页面有效，但另一个开始没有。这以一种惊人的、显然是随机的方式发生。它让我发疯......目前我有 12 页和 7 个工作，其余的没有。我决定继续填写这些页面，因为其中一些仍然是最后一页的模型，然后我会尝试看看发生了什么，然后我会填写一个完整的 jsfiddle。我认为这是唯一的方法。 :)
嗯，试试这个，假设每个页面都有单独的 PHP 文件，并且 JS 正确地在 <div data-role="page"> 内运行你的代码（在脚本标签之后立即运行 - 没有 doc.ready 你不要在 jQM 中使用它）jQuery("div:jqmData(role='page'):last").bind('pageinit', function(){ 这样当您导航到页面时，会触发正确的代码。如果你不这样做，你会遇到问题，因为 DOM 中同时存在多个页面，广泛的选择器炸毁 $('div.myClass') 可能会点击多个页面
也不要加载任何在头部运行的代码，只加载库。将该代码移动到页面 div 中

【解决方案2】：

只是为了完整起见：最后我解决了这个问题。页面中有一个未关闭的 div。有趣的是，我无法加载的页面不是拥有错误的页面，而是后续！现在看起来很明显，但是如果 javascript 和 php 没有触发错误，那么唯一要看的地方就是 html！我用这个验证了代码并发现了错误。 http://validator.w3.org/#validate_by_uri+with_options 谢谢大家提供有用的信息！

【讨论】：