Question

我有一个jQuery Mobile（1.1.0）应用程序在使用Chrome，FF，Mobile Safari和Android 2.2上的浏览器查看时运行。但是，在Android 4.0.3模拟器的浏览器中查看时存在一系列问题。

这些包括：

1）没有显示标题栏（显示时会短暂显示它们消失 - 固定页脚很好）。

2）页面上的按钮未显示 - 但仍然可以正确接收和处理点击事件。

这也发生在同事的ICS Android手机（Galaxy Nexus）上。

标记对于jQM来说都是相当标准的。例如，主按钮是标签。标题是：

<header data-role="header">
    <h1 data-bind="text: theTitle"></h1>

    <a id="waitButton" href="#" class="ui-btn-left" data-bind="click: wait">Wait</a>
    <a id="pollButton" href="#" class="ui-btn-right" data-bind="click: poll">Poll</a>
</header>

[数据绑定属性适用于Knockout.js]

有谁知道我需要改变它才能让它在ICS上工作？或者这是jQuery Mobile的“正在进行中的工作”吗？

Answer 1

发现问题。我在iOS测试期间添加了这个css规则：

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

Answer 2

确认。

升级后的Galaxy 10.1标签从3.2到4.0.3。 JQM 1.1页面未加载，主要显示空白页面，没有标题。

上述解决方案解决了所有这些问题。表现似乎也有所改善。但是，我们的页面不使用转换。

顺便说一句，输入类型=“日期”将正确激活本机日期选择器。 type =“number”将允许小数点，因为它应该具有，但不适用于3.2。

Answer 3

寻找救恩之后......我找到了帮助我的东西......

我补充说：

-webkit-transform: translate3d(0,0,0);
-webkit-transform: translateZ(0px);

到<div data-role=content ..>，它解决了问题！

虽然我仍然遇到jQuery弹出窗口的问题，尽管它的z-index很高，但它隐藏在其他元素之下。

为什么我的jQuery Mobile应用程序无法在Android 4.0.3浏览器中正确显示？

3 个答案: