JavaScript 修改 webview 内容后，Android WebView 不刷新
Posted
技术标签:
【中文标题】JavaScript 修改 webview 内容后，Android WebView 不刷新【英文标题】：Android WebView not refreshed after webview content has been modified by JavaScript 【发布时间】：2012-03-19 00:20:38 【问题描述】：我的应用程序使用带有透明背景的WebView，其中元素的一些样式属性由 javascript 修改。
问题：WebView没有根据修改后的属性刷新。当WebView 被重绘时（例如，由于用户方向改变）WebView 被正确更新。
我在 android 3.2（三星 GT）上重现了该问题，但在 Android 2.1 和 4.3 上一切正常。
重现问题的示例代码：
显然，当第一个图像被点击时它应该消失，然后点击第二个应该移动它。如果WebView 的背景颜色更改为不透明，或者如果我删除WebView 下方显示的图像，一切正常...
网页视图加载的 html。 ：
<!DOCTYPE html>
<html>
<body >
<img style="position:absolute;left:0px" onclick="this.style.display='none';"
src="http://flv.justad.tv/gallery/assets/trickplay/justad/tp-pause.png" />
<img style="position:absolute;left:200px" onclick="this.style.top='200px';"
src="http://flv.justad.tv/gallery/assets/trickplay/justad/tp-ff.png" />
</body>
</html>
布局文件：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="vertical"
>
<ImageView
android:layout_
android:layout_
android:scaleType="fitXY"
android:src="@drawable/display_background" />
<RelativeLayout android:layout_
android:layout_
android:id="@+id/WebviewContainer">
</RelativeLayout>
</RelativeLayout>
应用Activity：
public class TestImageMoveActivity extends Activity
@Override
public void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
RelativeLayout webviewContainer =
(RelativeLayout)findViewById(R.id.WebviewContainer);
WebView web = new WebView(this);
web.getSettings().setJavaScriptEnabled(true);
web.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
web.setLayoutParams(
new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));
web.setBackgroundColor(Color.TRANSPARENT);
webviewContainer.addView(web);
web.loadUrl("http://192.168.1.12/myWeb/localTmp/testImageMove.html");
点击前的屏幕截图：
Screen shot before tapScreen shot after tap on both images
【问题讨论】：
您的屏幕截图链接已损坏（权限被拒绝）。 抱歉...链接现在应该可以使用了 不用道歉，只是说你注意到了。 :) 看看这个链接它会给你一些想法***.com/questions/2563325/… 【参考方案1】：我遇到了类似的问题。出现问题是因为您必须在方向更改期间保存 WebView 的状态。如果不这样做，网页将被视为第一次加载。这意味着使用 JavaScript 动态应用的任何更改都将完全丢失。
首选/正确方式： 根据您的网络的复杂性，这可能需要一些工作，因为没有内置的方法可以这样做。您必须手动处理需要在 JavaScript 本身中保存的动态更改。要采取的步骤的高级视图：
-
Activity 的
onSaveInstanceState() 调用 JavaScript 函数，例如保存状态（）
saveState() 将必要的信息记录到 DOM 存储中，例如localStorage。
Activity 的 onRestoreInstanceState() 调用一个 JavaScript 函数，即 IE restoreState()
restoreState() 从 DOM 存储中加载信息并将网页更新为原始状态。
不明智但简单的方法：
在清单中覆盖您的活动configChanges。这将阻止重新创建活动，因此不应重新加载网页。
进一步阅读：Information about recreating an Activity from saved statePros/Cons to overriding configChanges
【讨论】：
【参考方案2】：制作刷新webview的方法 前任
void refreshWebview(WebView webView) webView.reload();从您的 javaScript 或使用接口的代码中的任何位置调用 refreshWebview()。
【讨论】：
【参考方案3】：尝试手动重新加载 webview:-
web.reload()
【讨论】：
以上是关于JavaScript 修改 webview 内容后，Android WebView 不刷新的主要内容，如果未能解决你的问题，请参考以下文章
android webview与 java与javascript的交互
如何从 JavaScript 滚动 <webview> 标签的内容？