Javascript 向输入添加文本并触发ajax搜索
一个网站正在表格中显示许多项目。当我在顶部的搜索栏中键入内容时，表格会发生变化，该搜索栏充当过滤器。这应该是自动化的（客户端） 我创建了一个Chrome扩展来运行脚本 问题：Javascript 向输入添加文本并触发ajax搜索,javascript,ajax,forms,input,google-chrome-extension,Javascript,Ajax,Forms,Input,Google Chrome Extension,一个网站正在表格中显示许多项目。当我在顶部的搜索栏中键入内容时，表格会发生变化，该搜索栏充当过滤器。这应该是自动化的（客户端） 我创建了一个Chrome扩展来运行脚本 问题： 我的脚本能够将搜索栏的值设置为我希望它使用的字符串： document.getElementById('filter').value = "Apple"; 问题是，即使搜索栏中的文本显示“apples”，下表也没有更新。如果我手动删除一封信，它会立即更新并过滤结果 有没有办法“模拟”实际的按键操作，以
我的脚本能够将搜索栏的值设置为我希望它使用的字符串：
document.getElementById('filter').value = "Apple";
编辑和编辑解决方案： 我一直在努力使这项工作，但每次都失败了。然后我开始学习一点jquery，并学习了这个。一行代码
$("#filter").val("apple").trigger('keyup');
var filter = document.getElementById("filter");
filter.value = "apple";
filter.dispatchEvent(new KeyboardEvent("keyup", {
bubbles: true,
cancelable: true,
key: "ArrowUp"
}));
您可以通过执行以下操作来模拟按键操作：
//有关按键模拟的更多信息，请访问：
// http://stackoverflow.com/a/5920206/1666547
//您不必了解这部分是如何工作的
//只需知道它使方法“document.triggerKeyPress”
//可供我们用于模拟按键
//把这个放在脚本开头的某个地方
//Node.prototype.triggerKeyPress=函数（字符）{
//var event=document.createEvent（'event'）；
//initEvent（'keyup'，true，true）；
//event.keyCode=char.charCodeAt（0）；
//文件、调度事件（事件）；
//}
//这第二部分你应该尽力去理解
//从D.O.M.上抓取滤芯。
var$filterElement=$（'#filter'）//document.getElementById（'filter'））
//如果需要，请为过滤器元件设置一个值
$filterElement.val（'Apple'））
//将光标聚焦在其上进行键入
$filterElement.focus（）
//从过滤器输入中获取值
//假设“查询输入”是“苹果”
var queryInput=$filterElement.val（）
//倾听事件
//window.addEventListener（'keyup'，函数（事件）{
//var actualCharacter=String.fromCharCode（event.keyCode）
//console.log（'Typed:'，actualCharacter）
//})
$filterElement.keyup（函数（事件）{
var actualCharacter=String.fromCharCode（event.which）
console.log（'Typed:'，actualCharacter）
})
//现在我们将遍历“queryInput”的每个字符
//并为每个字符触发一个“keyup”事件，以便表过滤器
//认为有人真的输入了“苹果”这个词并进行了过滤
//因此。
查询输入
.split（“”）//通过在空白处拆分字符串将其生成数组
.forEach（函数（字母）{//迭代字符“A-p-p-l-e”
//使用上面创建的“document.fire”方法
var e=jQuery.Event（'keyup'）；
e、 keyCode=字母.charCodeAt（0）；
e、 which=letter.charCodeAt（0）；//#一些关键代码值
$filterElement.trigger（e）；
//document.triggerKeyPress（letter）//触发“keypress”事件
})