Chrome扩展程序-触发器不起作用

Question

我尝试创建简单的Chrome扩展程序，在弹出窗口中单击按钮后，我需要将函数setInput（）发送到页面，函数更改值，并且如果要在Chrome控制台中使用此函数，则需要使用Trigger（'keyup'）-触发器工作。 但是，如果我在弹出窗口中单击后发送此功能-触发器不起作用（

Chrome扩展程序-触发器不起作用

控制台-触发工作

popup.html

<head>
  <script src="popup.js"></script>
</head>
<body>
    <div class="btn">Click</div>
</body>

popup.js

function sendMessage() {
    chrome.tabs.query({currentWindow: true, active: true}, function (tabs){
    var activeTab = tabs[0];
    chrome.tabs.sendMessage(activeTab.id, {"message": "start"});
   });
}

function onWindowLoad() {
    chrome.tabs.executeScript(null, { file: "PageReader.js" });
}

document.addEventListener("DOMContentLoaded", function() {
    var btn = document.querySelector('.btn');
    btn.addEventListener('click', function() {

        sendMessage();

    });
});

window.onload = onWindowLoad;

PageReader.js

- in file top i include Jquery

    function setInput() {
        var input = $('.text input');
        input.val('1111').trigger('keyup');
    }

    chrome.runtime.onMessage.addListener(
        function(request, sender, sendResponse) {
            if( request.message === "start" ) {
                setInput();
            }
        }
    );

Answer 1

谢谢大家的帮助，我找到了答案，删除了jQuery，并创建了事件“ keyup”

旧：

var input = $('.text input');
input.val('1111').trigger('keyup');

新：

var evt = document.createEvent('KeyboardEvent');
evt.initEvent('keyup', true, true);
var input = document.querySelector('.text input');
input.value = '1111';
input.dispatchEvent(evt);

Answer 2

如果已附加此事件处理程序btn.addEventListener('click', function() {请在btn.addEventListener('click', function() {之后btn.addEventListener('click', function() { debugger 。

第二件事 -您可能希望将初始化代码包装到setTimeout调用中，假设延迟为100ms，以检查您正在处理的页面是否不仅在某些生成此HTML的框架上工作，而且在DOMContentLoaded之后完成。 这意味着基本上将所有东西都包裹在内

document.addEventListener("DOMContentLoaded", function() {

与setTimeout(function() {/*everything inside goes here*/}, 100)

Chrome扩展程序-触发器不起作用

问题描述

2 个解决方案

解决方案1
1 2018-01-23 10:56:48

解决方案2
0 2018-01-23 07:36:57

Chrome扩展程序-触发器不起作用

问题描述

2 个解决方案

解决方案1 1 2018-01-23 10:56:48

解决方案2 0 2018-01-23 07:36:57

解决方案1
1 2018-01-23 10:56:48

解决方案2
0 2018-01-23 07:36:57