javascript - 如何使用按键事件填充元素

Question

这是代码:

<div class="sampletext" contenteditable="true" style="min-height: 40px;">
<span></span>
</div>

我想做的是用按键事件填充元素。

<div class="sampletext" contenteditable="true" style="min-height: 40px;">
<span>i need  to fill here with keyboard events. {ENTER}</span>
</div>

我已经编写了一个填充innerHtml的基本函数，

function myFunction() 
{
    var element = document.getElementsByClassName('sampletext')[0].firstChild;
    element.innerHTML = 'i need  to fill here with keyboard events.\n';
}

基本上这个功能可以完成这项工作，但它在正在尝试的网站中不起作用。如果我从键盘输入它，它就可以完美工作。该窗口正在监听 keyenter 事件。我正在使用 Chrome 浏览器。该项目与cefsharp相关。

private void SampleFucntion()
{
    string script = "var element = document.getElementsByClassName('sampletext')[0].firstChild;element.innerHTML = 'i need  to fill here with keyboardevents.\n';";
    myBrowser.ExecuteScriptAsync(script);
}

我已经检查过input fill with keypress simulation

所以请帮助我如何使用纯 JavaScript 来实现这一点。

Answer 1

实际上，您可以将击键直接发送到浏览器，这可能比执行 JavaScript block 更容易。当然假设文本框具有焦点。

SendKeyEvent 可用于一次发送一个字符。

CefSharp.WPF.Example 项目中有一个基本示例。 https://github.com/cefsharp/CefSharp/blob/cefsharp/43/CefSharp.Wpf.Example/Views/BrowserTabView.xaml.cs#L32