WebView2浏览器中

使用问题 · 60 次浏览
反卷练习生 创建于 5小时18分钟前

WebView2浏览器中使用浏览器子程序更新文本框内容,显示是更新进去了,但是鼠标一点击就不见了,下面的发送按钮也不能激活。这是什么原因?

同样的网页,在谷歌浏览器中使用浏览器控制更新这个内部文本,是正常的可以发送

反卷练习生 最后更新于 2025/6/9

回复内容
CL 5小时3分钟前
#1

浏览器控制会自动触发一些事件, changed之类的,可能有影响吧。

反卷练习生 回复 CL 5小时1分钟前 :

那该如何解决这个问题呀

CL 4小时40分钟前
#2

在 JavaScript 中,如果你希望给 <input> 框设置一个新值,并且触发它原本绑定的事件(如 input, change 或者框架自定义的监听器),需要手动分两步


✅ 1. 设置值

document.querySelector('#myInput').value = '新的值';

✅ 2. 触发事件(比如 inputchange

// 触发 input 事件
document.querySelector('#myInput').dispatchEvent(new Event('input', { bubbles: true }));

// 如果还需要触发 change 事件
document.querySelector('#myInput').dispatchEvent(new Event('change', { bubbles: true }));

🧩 示例(完整)

<input id="myInput" oninput="console.log('input事件触发:', this.value)" onchange="console.log('change事件触发:', this.value)">

<script>
  const input = document.querySelector('#myInput');
  input.value = '自动设置的值';

  // 触发 input 和 change 事件
  input.dispatchEvent(new Event('input', { bubbles: true }));
  input.dispatchEvent(new Event('change', { bubbles: true }));
</script>

⚠️ 注意事项

  • 有些框架(如 React)内部使用了特殊的事件系统,这种方式可能不完全触发其内部处理器。React 需要手动设置 value 属性并使用 input 事件派发(但需谨慎,因为 React 可能有 Shadow DOM 或内部优化)。

  • bubbles: true 让事件可以冒泡,方便框架或父元素监听。


如你在用某个框架(如 Vue、React、jQuery),我可以补充对应的最佳做法。需要的话请告诉我框架或具体场景。

反卷练习生 回复 CL 58 分钟前 :

怎么弄都弄不好,能不能麻烦做一个通用的WebView2浏览器控制子程序,现有的公共子程序用不了,只能点击触发,不能更新元素信息

CL 回复 反卷练习生 38 分钟前 :

上面例子是AI生成的,确保能看懂这个代码。 里面的选择器要改成实际网页里的选择器。

var input = document.querySelector('#chat-input');
  input.value = '自动设置的值';

  // 触发 input 和 change 事件
  input.dispatchEvent(new Event('input', { bubbles: true }));
  input.dispatchEvent(new Event('change', { bubbles: true }));
CL 最后更新于 21 分钟前
回复主贴