在ember.js中的按钮上触发手动点击事件不会提供所需的结果

Question

TL; DR:尝试在抽搐的聊天按钮上触发手动javascript点击事件,不会发送消息.不明白为什么事件不像普通点击那样做,也不知道如何让它发挥作用.

所以我试图为twitch.tv制作一个自定义机器人,只是直接从HTML中读取他的信息.我已经完美地完成了它可以识别命令并将文本放在文本框中的位置.现在我遇到的问题是,只要我尝试在"聊天"按钮上触发手动点击事件,它似乎就不起作用了.我的猜测是它与ember.js有关,我坦率地对此一无所知.无论如何,这是代码中不起作用的部分.编辑:如果我在控制台中将其作为单个输入,这在我的其余代码的上下文中不起作用.

$('.send-chat-button').click();

这里发生的是我获得了一个包含聊天提交按钮的html,这是:

<button class="button primary float-right send-chat-button" data-bindattr-3945="3945">
  <span>
    Chat
  </span>
</button>

当我尝试手动触发点击事件时,没有任何反应.但是,当我在buttonContain.children [0]和buttonContain.children 1(分别是设置和查看器按钮列表)上触发手动点击事件时,它确实有效.它们看起来像这样:

<a data-ember-action="3943" class="button glyph-only float-left" title="Chat Settings"></a>

我猜测不同之处在于data-ember-action和data-bindattr-*,但我不知道如何让它工作.这里的任何人都知道为什么click()事件不起作用并直接点击呢？

编辑:如果您对我的问题有任何疑问,请随时提出.

EDIT2:我进行了一些实验,我可以从按钮中删除所有HTML属性,点击它仍然有效.我不知道发生了什么:(.

EDIT3:好的,所以它似乎只有在我删除按钮内的Span时才停止工作仍然不知道发生了什么.(是的,还试图触发跨度上的click事件)

EDIT4:根据要求,这是我方的所有代码.请注意,我试图从抽搐本身单击一个按钮,其中我没有任何代码.通过在twitch.tv流上将其粘贴到控制台中,然后通过调用initiateMessageProcessing启动它来使用此代码.对于很多硬编码的值,我很抱歉,那些是我需要的抽搐领域.现在我只是在寻找一个概念证明.

var frequency = 5000;
var myInterval = 0;
var lastMessageId = 0;

function initiateMessageProcessing() {
    if (myInterval > 0) {
        clearInterval(myInterval);
    }

    myInterval = setInterval("checkMessages()", frequency);
}

function checkMessages() {
    var chat = document.getElementsByClassName("chat-lines")[0];
    processMessages(extractUnprocessedMessages(chat.children));
    lastMessageId = parseInt(chat.lastElementChild.getAttribute("id").substring(5, 10));
}

function extractUnprocessedMessages(chat) {
    var unprocessedMessages = [];
    var chatId = 0;
    for ( i = 0; i < chat.length; i++) {
        chatId = parseInt(chat[i].getAttribute("id").substring(5, 10));
        if (chatId > lastMessageId) {
            unprocessedMessages.push(chat[i]);
        }
    }
    return unprocessedMessages;
}

function processMessages(unprocessedMessages) {
    var messageElement;
    for ( i = 0; i < unprocessedMessages.length; i++) {
        messageElement = unprocessedMessages[i].children[0].getElementsByClassName("message")[0];
        if (messageElement != undefined && messageElement != null) {
            if (messageElement.innerHTML.search("!test") !== -1) {
                sendMessage('Hello world!');
            }
        }
    }
}

function sendMessage(message) {
    fillTextArea(message);
    var button = $('.send-chat-button').get(0);
    var event = new MouseEvent('click', {
        bubbles : true
    });
    button.dispatchEvent(event);
}

function fillTextArea(message){
    var textArea;
    var chatInterface = document.getElementsByClassName("chat-interface")[0];
    var textAreaContain = chatInterface.children[0];
    textArea = textAreaContain.children[0].children[0];
    textArea.value = message;
}

EDIT5:Eventlistener截图:

EDIT6:编辑的源代码使用$('.send-chat-button').click(); 我试过这个,在当前代码中不起作用,如果我在聊天中有文本时手动触发控制台中的这个命令,它确实有效.但遗憾的是我的代码不起作用.

编辑7:使用Ember.run,仍然无法正常工作.

EDIT8:使用dispatchmouseevent,仍然无法在代码上下文中工作

Answer 1

目标站点似乎在没有 JQuery 帮助的情况下附加了事件侦听器。如果是这样，则无法使用 jquery .click() 方法触发它。

您可以尝试直接模拟浏览器事件，如下所示：

var button = $('.send-chat-button').get(0);
var event = new MouseEvent('click', {bubbles: true});
button.dispatchEvent(event);

这段代码在 IE8 及更低版本中不起作用，但我想这不是你的情况。