Question

我正在使用“JqueryMobile”来构建我的Android应用程序。我面临的问题是JQueryMobile样式没有应用于页面..

以下是我的HTML页面的代码（在Webview中）

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title></title>

<link href="css/styles.css" rel="stylesheet" type="text/css"></link>
<script src="js/jquery.js"></script>
<script src="js/jquery.mobile-1.0.min.js"></script>

</head>

<body>

<div id="home" data-role="page">
  <div data-role="header"><h1>Categories</h1></div>
  <div data-role="content">
    <h2>Select a Category Below:</h2>
    <ul data-role="listview" data-inset="true">
        <li><a href="#category-items?category=animals">Animals</a></li>
        <li><a href="#category-items?category=colors">Colors</a></li>
        <li><a href="#category-items?category=vehicles">Vehicles</a></li>
    </ul>
  </div>
</div>

</body>

</html>

以下是我的Activity类中的代码

    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    WebView webView = (WebView)findViewById(R.id.webView);
    webView.getSettings().setJavaScriptEnabled(true);
    webView.getSettings().setDomStorageEnabled(true);
    webView.setWebChromeClient(new WebChromeClient());

    webView.loadUrl("file:///android_asset/www/index.html");

关于如何解决它的任何指针??

Answer 1

发现问题..

我在Android 4.0的模拟器中测试我的应用程序.JQueryMobile似乎不支持“冰淇淋三明治”，因此即使主要功能也无法正常工作..今天我测试了相同的应用程序（没有任何Android 2.3.3中的代码修改，它就像魅力一样：）

我花了差不多2天的时间来弄清楚这一点:(为了别人的缘故在这里张贴：）

Answer 2

您是否尝试过jQM 1.1.0决赛？我注意到你在上面的代码中使用了jQM 1.0.0。据说jQM 1.1.0决赛支持Ice Cream Sandwich。来自jQM网站：

“Android 4.0（ICS） - 在Galaxy Nexus S上测试。注意：升级设备的转换性能可能很差”

Answer 3

看看这个答案：https://stackoverflow.com/a/10420027/1538975

问题出现在ICS中。只需添加此css代码，一切正常（我今天遇到了同样的问题）。

.ui-page {
    /* Supposed to reduce flickering, but screwed up Ice Cream Sandwich. */
    -webkit-backface-visibility: hidden;
}

JQueryMobile - 未在Webview中应用的样式（Android）

3 个答案: