在webview内容被JavaScript修改后,Android WebView不会刷新

Question

在webview内容被JavaScript修改后,Android WebView不会刷新

hai*_*rok 18 android android-widget android-webview

我的应用程序使用WebView透明背景,其中元素的一些样式属性由JavaScript修改.

问题:WebView根据修改后的属性不刷新.何时WebView重绘(例如,由于用户方向改变),WebView正确更新.我在Android 3.2(在Samsung GT上)上重现了这个问题,但在Android 2.1和4.3上都可以正常工作.

重现问题的示例代码:
显然,当第一个图像被点击时,它应该消失,点击第二个图像应该移动它.如果将背景颜色WebView更改为不透明,或者如果我删除下面显示的图像,则WebView所有工作正常...

Web视图加载的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>

Run Code Online (Sandbox Code Playgroud)

布局文件:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    >

     <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:scaleType="fitXY"
                android:src="@drawable/display_background" />

    <RelativeLayout android:layout_width="wrap_content" 
        android:layout_height="wrap_content"
        android:id="@+id/WebviewContainer">

    </RelativeLayout>

</RelativeLayout>

Run Code Online (Sandbox Code Playgroud)

申请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");
    }
}

Run Code Online (Sandbox Code Playgroud)

点按前的屏幕截图:

水龙头前截屏
 屏幕点击拍摄后的两个图像

Answer 1

Jay*_*yer 1

我遇到了类似的问题。WebView出现问题的原因是您必须在方向更改期间保存状态。如果不这样做，网页将被视为第一次加载。这意味着使用 JavaScript 动态应用的任何更改都将完全丢失。

首选/正确的方法：
根据网络的复杂性，这可能需要一些工作，因为没有内置的方法可以做到这一点。您必须手动处理需要在 JavaScript 本身中保存哪些动态更改。要采取的步骤的高级视图：

ActivityonSaveInstanceState()调用 JavaScript 函数，例如 saveState()
saveState() 将必要的信息记录到 DOM 存储中，例如localStorage.
ActivityonRestoreInstanceState()调用 JavaScript 函数 IE RestoreState()
RestoreState() 从 DOM 存储加载信息并将网页更新到原始状态。

不明智但简单的方法：覆盖清单中的
活动。configChanges这将阻止重新创建活动，因此不应重新加载网页。

进一步阅读：
有关从保存的状态重新创建 Activity 的信息，
优点/缺点到覆盖 configChanges

归档时间：	13 年，9 月前
查看次数：	4001 次
最近记录：	10 年，4 月前