使用面板时出现 jQuery Mobile 1.3.2 错误答案

【问题标题】：jQuery Mobile 1.3.2 error when using panel使用面板时出现 jQuery Mobile 1.3.2 错误
【发布时间】：2013-09-14 15:54:24
【问题描述】：

我正在尝试使用 jQuery Mobile 1.3.2 实现面板功能。这是我的代码：

    <div data-role="page" id="homePage">
    <section data-role="panel" class="row">
        PANEL HERE..
    </section>

    <section data-role="header" class="row">
        <div class="large-12 columns">
            <h3>
                Header..
            </h3>               
        </div>          
    </section>

    <section data-role="content" class="row">
        <div class="large-12 columns">
            CONTENT..               
        </div>          
    </section>

    <section data-role="footer" class="row">
        <div class="large-12 columns">
            FOOTER..                
        </div>          
    </section>

    <script type="text/javascript">
        $(function ()
        {

        }());
    </script>
</div>

当我运行这是一个浏览器时，我得到一个错误：

$.data(...) 未定义

我已经追踪到 jquery.mobile-1.3.2.js 的第 10330 行：

var $theme = $.data( page[0], "mobilePage" ).options.theme,

我错过了什么？

【问题讨论】：

标签： jquery-mobile jquery-mobile-panel

【解决方案1】：

我看到 jQuery mobile panel 与 jQuery 2.0 不兼容。

你得到了错误：

TypeError: 'undefined' 不是一个对象（评估 'a.data(d[0],"mobilePage").options')

尝试降级到 jQuery 1.9 它可以使用它。

演示：http://jsfiddle.net/IrvinDominin/3wUts/

【讨论】：

是的，重要的是主要版本 1。问题在于 2。
jQM 1.3.2 不支持 jQuery 2.x.x

【解决方案2】：

如果您在 jquery mobile javascript 文件（无论是否缩小）中快速搜索“mobilePage”一词并将其更改为“mobile-page”，它就会起作用。应该只有一场比赛。我遇到了这个问题并让它正常工作。

修复的来源是：https://github.com/jquery/jquery-mobile/issues/6200

【讨论】：

很好的修复。我正在使用 jqm1.3.2 和 jq2.0.3，这对我有用。

【解决方案3】：

我在脚本头中包含行之后添加了这段代码：

<script type="text/javascript" src="//code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>

<script type="text/javascript">
  var jqDataOrg = $.data;
  $.data = function (a, b, c) { return jqDataOrg(a, b === "mobilePage" ? "mobile-page" : b, c); };
</script>

它允许我继续使用 jQuery 2 和 CDNs 进行分发。可能有一些我不知道的副作用，所以要小心。

【讨论】：