如何强制 Android Webview 在 DOM 更改上重新绘制？答案

【问题标题】：How to force Android Webview to repaint on DOM changes?如何强制 Android Webview 在 DOM 更改上重新绘制？
【发布时间】：2013-01-30 01:50:54
【问题描述】：

我目前正在开发一个需要在 Android Webview 中作为本机应用程序的一部分运行的 Web 门户。整个门户网站大量基于 AJAX。因此，每当提交表单时，都是异步完成的。根据响应，我需要显示一个消息框，显示“成功”或“错误”。我现在正在用 jQuery 做这个。问题是，Android Webview 不会重新绘制，因此消息框将不可见。有帮助的是点击屏幕上的任意位置。这似乎迫使重新粉刷。不，我需要做的是：

1) 以其他方式更改 DOM，以便 Android Webview 正确处理。

或

2) 通过触发一些（伪）事件或使用一些肮脏的 hack 来强制重新绘制 :)

有人遇到过这个问题吗？非常感谢任何提示。

【问题讨论】：

标签： android jquery dom webview updating

【解决方案1】：

观看此video 并阅读此answer。诀窍是使用

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

需要更新的 div 上的 css 样式。这会创建一个新层，并且动画/更新变得更加流畅。

【讨论】：

【解决方案2】：

我从来没有遇到过它显示来自非异步调用的 DOM 更新的问题，所以也许一个解决方案是让你的异步方法回调一个注入的对象 (WebView.addJavascriptInterface()) - 然后让它运行一个调用在 UI 线程上到 Webview 来更新 UI？

【讨论】：

【解决方案3】：

换个思路就能得到你想要的结果：

就这通过 jQuery 工作而言，您是否尝试过在您的 WebView 上启用 JavaScript？通过这种方式，您应该能够在 WebView 中执行 JavaScript 代码（并且可能会看到来自 jQuery 的更改）。

myWebView.getSettings().setJavaScriptEnabled(true);

【讨论】：

【解决方案4】：

这是我每次强制 webview 更新的方法，请参见代码： // WEBVIEW

package com.example.scroll;
// philip r brenan at gmail.com, www.appaapps.com 
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.util.Log;
import android.webkit.WebView;

public class MainActivity extends Activity
 {protected void onCreate(Bundle savedInstanceState)
   {super.onCreate(savedInstanceState);
    setContentView(new MyWebView(this)); 
   }
  class MyWebView extends WebView 
   {MyWebView(Context Context)
     {super(Context);
      getSettings().setJavaScriptEnabled(true);
      addJavascriptInterface(this, "Android");   
      new Thread()
       {public void run()
         {for(int j = 0; j < 100; ++j)
           {post(new Runnable()
             {public void run()
               {loadData(content(), "text/html", "utf-8"); // Display in browser
               }
             });    
            try {Thread.sleep(5000);} catch(Exception e) {}
           }  
         }
       }.start();
     } 
    int c = 0, C = 1;
    String content() 
     {final StringBuilder s = new StringBuilder();
      //s.append("<html id="+(C++)+"><body>"); // WEBVIEW REFRESHES CORRECTLY *************** 
      s.append("<html><body>");              // WEBVIEW DOES NOT REFRESH ******************

      s.append("<h1 id=11>1111</h1>");
      s.append("<script>location.href = '#22';</script>");
      for(int i = 0; i < 10; ++i) s.append("<p>"+c+c+c); ++c;

      s.append("<h1 id=22>2222</h1>");
      for(int i = 0; i < 10; ++i) s.append("<p>"+c+c+c); ++c;
      Log.e("AAAAAA", "content="+s.toString());
      s.append("</body></html>");
      return s.toString();
     }
   } 
 }

【讨论】：

这个答案有我见过的最性感的牙套放置方式:-)