javascript - 点击事件后显示隐藏的 div 在 phonegap 中很慢

Question

我正在使用 phonegap 为 android 开发一个网络应用程序。我正在使用 jquery 移动点击事件，对于每个点击事件，我想在显示内容之前显示一个加载 div。我看到点击事件和加载显示之间存在延迟分区 下面是我写的代码片段

    $('#events').bind('tap',function () {           
        document.getElementById("loadingDiv").style.display = "block";  
       });

这是我的 loadingDiv

<div id="loadingDiv"></div>

#loadingDiv {position: fixed; background:black url('images/ajax-loader.gif') no-repeat center 20%; height:100%; width:100%; z-index:100000;}

而且为了加快 Jquery 移动设备的速度，我也关闭了转换。

请指导我如何立即显示 loadingDiv 以获得良好的用户体验。

Answer 1

假设正确调用了 jQuery 移动点击事件。这听起来像是浏览器需要一段时间才能实际显示到元素的问题。

由于“显示:无”not being included in the render tree ，当您将其更改为阻止浏览器时，可能需要一段时间才能执行此操作。

一些解决方案将元素设置为“不透明度:0”并将其设置为“不透明度:1”(或者是可见性属性)。这样做意味着元素会影响布局，但由于您使用的是固定位置，所以这应该不是问题。