向Android Webview中的DOM元素添加类时，CSS样式更改需要2-3秒才能显示出来

Question

假设我有一个DOM元素，在div中有一串文本

<div id="bio"> I'm Captain America! </div>

现在，我在这个div上放置了一个onClick侦听器，并在onClick侦听器回调函数中

$('.bio').addClass('red')

在我的CSS文件中，我有这一行

.red { color: red; }

如果我在普通的网络浏览器(Chrome，Firefox，Safari等)上试用它……单击时，文本会立即变为红色。但是，如果我从Android应用程序中嵌入的Android Webview执行此操作..然后，文本需要2-3秒才会变成红色。

知道为什么吗？

Answer 1

我解决了这个问题-在我的WebAppInterface (Javascript Interface listener)中有一个阻塞的HTTP请求调用，它导致UI在调用完成时冻结到2-3秒。将其替换为非阻塞(异步)调用，现在它工作得很好。

Answer 2

虽然这通常不需要2-3秒，但一些移动浏览器在点击事件上的默认延迟为300ms。

您可以使用FastClick来修复此问题，它是一个消除此延迟的javascript库

https://github.com/ftlabs/fastclick