如何在cef中方实现网页文本输入框的历史记录下列表提示功能

Question

如何在cef中方实现网页文本输入框的历史记录下列表提示功能，微信suniums，

Answer 1

有帮助的话 采纳一下呦
在 CEF 中实现网页文本输入框的历史记录下拉列表提示功能,可以采取以下步骤:
在 C++ 代码中创建一个 CefListValue 对象,用于存储历史记录条目。

CefRefPtr<CefListValue> history_list = CefListValue::Create();

在用户输入时,使用 JavaScript 代码获取输入框的值,并将其添加到 C++ 中的 CefListValue 对象中。
js

let input = document.querySelector('#input');
input.addEventListener('input', function() {
    window.historyList.AddString(input.value);
}); 

// C++ 代码中与 JavaScript 交互的函数
void ClientHandler::AddStringToHistory(const CefString& input) {
    history_list->AddString(input);
}

读取 CefListValue 中的条目,并使用 JavaScript 在输入框下方展示下拉列表。

let list = '';
let count = window.historyList.GetSize();
for (let i = 0; i < count; i++) {
    list += `<option>${window.historyList.GetString(i)}</option>`; 
}
document.querySelector('#history-list').innerHTML = list;

// C++ 代码中与 JavaScript 交互的函数  
void ClientHandler::GetHistoryList(CefRefPtr<CefListValue> list, 
                                   CefRefPtr<CefValue> object) {
    *object = list;  
}

为下拉列表绑定选择事件,当用户选择某条历史记录时,将输入框的值设置为该条历史记录。

document.querySelector('#history-list').addEventListener('change', function() {
    let value = this.value;
    document.querySelector('#input').value = value;
});