WebView ContentChanged事件

时间:2017-03-06 13:47:45

标签: c# windows webview uwp

我想在我的应用程序中使用一个网站来显示内容。

我必须运行像getNames()这样的JavaScript代码,它将在div中填充名称。执行代码后,需要1-2秒才能填写。

我想在填充div时更新应用程序。问题是,我找不到像webView1.ContentChanged或webView1.SourceChanged这样的事件。只有这样才能创建一个Timer,将其设置为3秒,然后在执行getNames()并获取源代码时启动它。

有人有任何想法吗?

由于

1 个答案:

答案 0 :(得分:1)

WebView没有内置事件来支持检测更改的内容。您可以将InvokeScriptAsync与JavaScript eval函数一起使用以使用HTML事件处理程序,并使用HTML事件处理程序中的window.external.notify来使用WebView.ScriptNotify通知应用程序。

关于如何检测由javascript更改的html内容,您可以参考DOM mutation events replacement

MDN->Web technology for developers->Web APIs->MutationObserver

我为您制作了一个简单的代码示例:

<WebView Source="ms-appx-web:///HTMLPage1.html" ScriptNotify="WebView_ScriptNotify"></WebView>

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script type="text/javascript">

        function detectContent()
        {
            var target = document.getElementById('div');

            var observer = new MutationObserver(function (mutations) {
                mutations.forEach(function (mutation) {
                    window.external.notify('div changed');
                    update("div changed");
                });
            });
            var config = { attributes: true, childList: true, characterData: true };
            observer.observe(target, config);
        }

        function update(e)
        {
            var div = document.getElementById("div");
            div.innerHTML = e;
        }
    </script>
</head>
<body onload="detectContent();">
    <div id="div" style="margin-top:100px;"></div>
    <br />
    <input value="update" onclick="update('abc');" type="button"/>
</body>
</html>

private void WebView_ScriptNotify(object sender, NotifyEventArgs e)
{
    System.Diagnostics.Debug.WriteLine(e.Value);
}

然后,如果更改Div的内容,将触发WebView的ScriptNotify事件。在我的代码示例中,Webview只是加载本地html页面。

在您的情况下,如果您不拥有该网站,则需要使用InvokeScriptAsync在WebView navigatstarting事件中注入javascript代码。