在Enter键模拟时触发默认行为

Question

So (just to start with "so") I want to create a greasemonkey script for a qwebirc platform. I need to send replies automatically based on some events that happen. For those who don't know, once logged in the qwebirc, there is an input text field at the bottom of the screen where you can write your reply and then, by pressing enter, the reply is sent to the server. The input field is contained in a form element, but the form has no submit button.

I can populate the input field (no problem) by writing to its "value" attribute, but I found no way to "submit" the reply to the server. I tried calling the .submit() method on the container form element, but that simply reloads the page (so it's sending to itself - and that makes sense, 'cause there's no "action" attribute on the form element). It seems to me that the only explanation is that once the enter key is pressed in the input field there's a method that's called somewhere on the qwebirc.js.

I can't find the code responsible for this action (though I worked that in Chrome, I set an Event Listener Breakpoint on the Keyboard - Input, and that stopped me when I pressed the enter key and pointed me to the beginning of some function) because the script is minified and there's no way for me to know what those "m", "n", "p", "t" etc mean. If I had the uncompressed version, I could scan it and, maybe, find it out. I also tried downloading the qwebirc project, but there are loads of files there - whereas on the server I'm trying to write the greasemonkey script there's a single script.

The main idea here is that I guess the enter key press simulation should trigger the sending function - wherever and whichever that may be.

In order to do this I found on stackoverflow some questions with the same subject - the simulation of enter key press. I tried that code:

function simulate() {
    var evt = document.createEvent('KeyboardEvent'),
        input = document.querySelector('.keyboard-input');

    evt.initKeyboardEvent(
        'keydown', 
        true, 
        true, 
        window, 
        false, 
        false, 
        false, 
        false, 
        13, 
        0
    );

    input.dispatchEvent(evt);
}

The event is created (I can see it in my DOM panel in FireBug), but no action whatsoever is taken. I mean why doesn't the .dispatchEvent() behave just like a real enter key press ?

Thanks in advance.

Answer 1

For the purposes of this answer, I'm going to assume that the message input pseudo-form is like others - ie the message can be sent by either pressing Enter or clicking a Send button.

You've tried the former; it didn't work. It's possible that the page is waiting for the Send button to be clicked (which may be triggered by an Enter keypress (though no, I don't know why your event isn't working - I'm unfamiliar with event intricacies)). Instead, then, try that.

Also, take note : IE uses fireEvent not dispatchEvent - so if you're in IE, this may be the problem.

To fire a click on the Send button:

var e = document.createEvent("MouseEvents");
e.initEvent("click", true, true);
e.target = "button#send";

if(document.fireEvent) {
    document.fireEvent(e);
}
else {
    document.dispatchEvent(e);
}

Change the string assigned to e.target to the CSS selector that uniquely identifies the Send button.