Question

我在使jquery移动设备正常工作时遇到了一些问题。我使用的是the anatomy of a page和this stackoverflow example。

我期望的输出是jqm只显示代码中第一个数据角色的内容。然而，实际发生的是在jqm加载之后，它将视图设置为浏览器窗口的大小，但仍然显示第二个数据角色的内容加上单词＆＃34; loading＆＃34;在它下面。

我很确定我错过了一些非常简单的事情。任何帮助将不胜感激。

我正在使用PhoneGap和RequireJS。

以下是代码：

index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="msapplication-tap-highlight" content="no" />
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
    <link rel="stylesheet" type="text/css" href="css/app.css" />
    <title>Student Picker</title>
</head>
<body>
    <div data-role="page" id="test1">
        <a href="#test2">Goto Test2</a>
    </div>
    <div data-role="page" id="test2">
        <a href="#test1">Goto Test1</a>
    </div>
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="require.js"></script>
    <script type="text/javascript" src="main.js"></script>
</body>
</html>

main.js

require.config({

baseUrl: 'js',
paths: {

    'jquery': 'jquery',
    'jquery.mobile.config': 'jquery.mobile.config',
    'jquery.mobile': 'jquery.mobile',
    'app': 'app'
},
map: {

    '*': {'jquery': 'jquery-private'},
    'jquery-private': { 'jquery': 'jquery' }
},
shim: {

    'jquery.mobile.config': ['jquery'],
    'jquery.mobile': ['jquery', 'jquery.mobile.config']
}
});

require(['jquery', 'app', 'jquery.mobile'], function(jq, app) {

jq(function() {

    //app.initialize();
});
});

jquery.mobile.config

define(['jquery'], function (jq) {

jq(document).on("mobileinit", function () {

    jq.mobile.ajaxEnabled = false;
    jq.mobile.linkBindingEnabled = false;
    jq.mobile.hashListeningEnabled = false;
    jq.mobile.pushStateEnabled = false;
});
});

输出图片：

Output

无论有没有jqm配置文件，结果都是一样的。如果您需要更多信息，请随时发表评论：）

Answer 1

代码中缺少与JQM文件对应的CSS文件。

添加CSS文件，它应该有效，因为＆＃34; data-role＆＃34;作为CSS选择器。

数据角色在jqm中不显示一个页面

1 个答案: