gil*_*lzu 5 jquery google-chrome javascript-events google-chrome-extension content-script
我无意中尝试从chrome内容脚本激活change()事件.我已经浏览了网站和谷歌帖子,但仍然无效.
这里是我试图实现的描述
考虑以下网页(如果有人帮助,可以通过http://www.gilzu.com/TFF/select.html访问):
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Untitled Page</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#woot').die('change');
$('#woot').live('change', function () {
$('#description').text(jQuery('#woot').val());
});
console.log("window ready");
$("#meh").click(function() {
$('#woot').val(15);
$('#woot').change();
});
$('#woot').val(21);
$('#woot').change();
});
</script>
</head>
<body>
<p>
<select id="woot">
<option id="Option1" value="15">a</option>
<option id="Option2" value="16">b</option>
<option id="Option3" value="17">c</option>
<option id="Option4" value="18">d</option>
<option id="Option5" value="19">e</option>
<option id="Option6" value="20">f</option>
<option id="Option7" value="21">g</option>
</select>
</p>
<p id="description"></p>
<p><input type="button" id="meh" /></p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
什么工作:1.在启动时,change()激活并将选择框更新为21并在div上显示正确的值.2.按下#meh按钮,将选择框更改为15,触发在屏幕上显示正确值的change()事件.
到目前为止并不奇怪.
所以我通过以下方式前往内容脚本:
$(document).ready(function () {
$('#woot').val(17);
$('#woot').change();
});
Run Code Online (Sandbox Code Playgroud)
所以select标签更新,但change()事件不会触发.
我已经阅读了有关chrome扩展孤立世界的论坛,并对此理论进行了测试:
$(document).ready( function() {
$("#meh").click();
});
Run Code Online (Sandbox Code Playgroud)
并且它实际上触发了选择框的click事件和change事件!
另外,与另一篇声称与js的代码注入有效的帖子相矛盾:
$(document).ready( function() {
var x = $("<script type='text/javascript' />");
$(x).text("$('#woot').val(18); $('#woot').change();");
$("head").append(x);
});
Run Code Online (Sandbox Code Playgroud)
发出相同的效果:选择框更新但更改事件不会触发.
我还尝试了以下方法:1.创建一个按钮,例如示例的#meh,附带一个单击事件,触发select标签的更改().只有选择更新,没有事件触发.2.通过attr(),prop(),val()更改选择框的值只选择更新,不会触发事件.3.通过change(),trigger('change')和selectedIndex仅触发选择更新,不触发任何事件来触发事件.4.通过js 5.延迟命令使用focus()另一个控件,这个控件甚至模糊()选择框,如某些帖子所示.
非常感谢您的帮助
PAE*_*AEz 10
我真的不知道JQuery,但是如果没有JQuery并且没有在页面中注入任何内容,这里是如何做到的....
var selections = document.querySelector('#woot');
selections.value = 17;
var evt = document.createEvent("HTMLEvents");
evt.initEvent("change", true, true);
selections.dispatchEvent(evt);
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
2501 次 |
| 最近记录: |