时间戳

首页 > 解决方案 > 在 uwp webview InvokeScriptAsync 中调用列表框更改

webview - 在 uwp webview InvokeScriptAsync 中调用列表框更改

问题描述

我在 uwp 中使用 webview 来与网页交互。除列表框外，一切正常。我打电话 ：

await Webview.InvokeScriptAsync("eval", new string[] { "document.getElementsByClassName('select-box')[0].getElementsByTagName('select')[0].selectedIndex = 1;" });

选择是视觉上的变化，但没有调用网页的变化函数。表示没有效果！所以我尝试触发此调用并添加（更改侦听器位于选择框 0 上）

await Webview.InvokeScriptAsync("eval", new string[] { "document.getElementsByClassName('select-box')[0].dispatchEvent(new Event('change', { bubbles: true }));" });
        await Webview.InvokeScriptAsync("eval", new string[] { "document.getElementsByClassName('select-box')[0].getElementsByTagName('select')[0].dispatchEvent(new Event('change', { bubbles: true }));" });
        await Webview.InvokeScriptAsync("eval", new string[] { "document.getElementsByClassName('select-box')[0].change();" });
        await Webview.InvokeScriptAsync("eval", new string[] { "document.getElementsByClassName('select-box')[0].getElementsByTagName('select')[0].change();" });

这 4 行都不起作用。所以我想知道 change() 调用是否可行？欢迎任何帮助。

标签： webviewuwpwindows-10

解决方案

当我调用 jquery change 方法时，它会触发网页上的 change 事件。

我制作了一个简单的代码示例进行测试，它在我这边运行良好。

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
$(document).ready(function(){
    $("#select").on('change', function () {
        $("#ptext").text(this.value);
    });
});
    </script>
</head>
<body>
    <select id="select">
        <option value="volvo">Volvo</option>
        <option value="saab">Saab</option>
        <option value="mercedes">Mercedes</option>
        <option value="audi">Audi</option>
    </select>

    <p id="ptext">Write something</p>
</body>
</html>

<Grid>
    <WebView x:Name="webview" Source="ms-appx-web:///HTMLPage1.html"></WebView>
    <Button Content="call js" Click="Button_Click"></Button>
</Grid>

private async void Button_Click(object sender, RoutedEventArgs e)
{
    await webview.InvokeScriptAsync("eval", new string[] { "document.getElementById('select').selectedIndex=2;$('#select').change();" });
}

推荐阅读