Chrome扩展：如何将'keydown'事件发送到页面的输入？ [英] chrome extension: how to send 'keydown' event to page's input?
问题描述
<！doctype html> 我有一个测试网页，提醒我是否在输入栏中输入了一个键。 ;
< html>
< head>
< script type =text / javascriptsrc =jquery-1.9.1.min.js>< / script>
< script>
$（document）.ready（function（）{
$（'#foo'）.keydown（function（）{alert（debug）;}）;
}）;
< / script>
< / head>
< body>
< input id ='foo'type ='type'/>
< / body>
< / html>
我有这个扩展名修改了输入文本并激发了keydown事件：
$（document）.ready（function（）{
window.setTimeout（function（）{
$（'#foo '）.val（foo）;
$（'#foo'）.keydown（）;
}，2000）;
}）;
如果我安装了扩展程序，2秒后（如预期）修改文本 - 但不显示警报，所以我可以建议 keydown 事件不会从扩展沙箱传递到页面JavaScript处理程序。是否有可能以某种方式修改我的代码，以便扩展可以模拟页面上的JavaScript可以看到的keydown？我通过chrome扩展自动化第三方网站，其中一个输入需要 keyup 来检测价值变化（我自动化的页面写得很糟糕 - 但我您的代码不工作，因为jQuery的 keydown（）方法实际上并不触发真实keydown事件。相反，jQuery在 jQuery.cache 中查找绑定事件处理程序，并调用相应的函数。
由于您的内容脚本的 jQuery 对象与页面的 jQuery 对象不同，调用 .keydown（） 不会导致任何操作。
就你而言，我建议在代码页中注入代码，以便代码在与页面相同的上下文中运行。然后，调用 $（'＃foo'）。keydown（）将使用页面的jQuery对象，并产生预期的行为。
不依赖任何库的通用解决方案是使用 KeyboardEvent 构造函数（在DOM4中定义）触发事件：
var event = new KeyboardEvent（'keydown'）;
document.querySelector（'＃foo'）。dispatchEvent（event）;
I have a test web page that alerts if i hit a key in it's input field:
<!doctype html>
<html>
<head>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script>
$( document ).ready( function() {
$( '#foo' ).keydown( function() { alert( "debug" ); } );
});
</script>
</head>
<body>
<input id='foo' type='type'/>
</body>
</html>
And i have this chrome extension that modifies input text and fires keydown event:
$( document ).ready( function() {
window.setTimeout( function() {
$( '#foo' ).val( "foo" );
$( '#foo' ).keydown();
}, 2000 );
});
If i install extension, after 2 seconds (as expected) text is modified - but alert is not displayed, so i can suggest that keydown event is not passed from extension sandbox into page javascript handler. Is it possible to modify my code somehow so extension can emulate keydown that javascript on the page can see? I'm automating a third-party website via chrome extension, and one of the inputs requires keyup to detect value change (the page i'm automating is written badly - but i don't have any control other it's source code).
Your code is not working because jQuery's keydown() method does not actually trigger a "real" keydown event. Instead, jQuery looks up the "bound" event handlers in jQuery.cache, and calls the corresponding functions.
Since your content script's jQuery object differs from the page's jQuery object, invoking .keydown() doesn't cause any action.
In your case, I suggest to inject your code in the page, so that your code runs in the same context as the page. Then, calling $('#foo').keydown() will use the page's jQuery object, and result in the expected behaviour.
A general solution, which doesn't depend on any library is to use the KeyboardEvent constructor (defined in DOM4) to trigger the event:
var event = new KeyboardEvent('keydown');
document.querySelector('#foo').dispatchEvent(event);
这篇关于Chrome扩展：如何将'keydown'事件发送到页面的输入？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
