How do i simulate a click or keydown event?

Question

I need to simulate a click or mouse event. I tried various things but the lib i am using doesnt seem to respond to it or does respond but only on specific browsers. ATM i do $('#target').val($('#target2').val()); which works on firefox and opera. Fails on chrome, IE8 and safari.

I could add events to the libs but i wouldnt know which event to add (or how to do it properly). Anyways how do i solve this? basically i am setting the textarea text with .val() and the lib doesnt seem to pick up that event.

What you mean by "libs"? What library? What you expect to happen when you set the textarea text? `$('#target').val($('#target2').val());` got nothing to do with click or keydown event, it's only setting value of something to be equal to value of something else.. — Shadow The GPT Wizard, Jan 18 '11 at 14:21
@Shadow Wizard: yes and as i mention the library i am using doesnt pick up the event. I need to trigger the event for the code to work correctly — , Jan 18 '11 at 14:25
yes to what? You didn't answer any of my questions and none was Yes/No.. — Shadow The GPT Wizard, Jan 18 '11 at 14:34

jAndy · Accepted Answer · 2011-01-18T14:33:38.813

3

You could use the DOM Level 2 Event Model, like:

function simulateClick(element) {
  var evt = document.createEvent("MouseEvents");
  evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
  cb.dispatchEvent(element);
}

Demo: http://www.jsfiddle.net/4yUqL/66/

This will truly simulate a mouseclick on an element. Regardless how events were bound.

edited Jan 18 '11 at 14:33

answered Jan 18 '11 at 14:27

jAndy

231,737
57
305
359

That didnt work but KeyboardEvent did :). Accepted! `var evt = document.createEvent("KeyboardEvent"); evt.initKeyboardEvent("keypress", true, true, null, false, false, false, false, 0, 0); element.dispatchEvent(evt);` – Jan 18 '11 at 14:46
@qwertymk: It does for me. In all browsers except IE (8) – Jan 18 '11 at 14:47
well, I'm not quite sure how many browsers this implement already. FireFox 3.6.13 works well for me. – jAndy Jan 18 '11 at 14:48
@qwertymk: Does this one work for you? I havent tried to make this one FF compatible. http://www.jsfiddle.net/4yUqL/71/ – Jan 18 '11 at 15:04
@qwertymk: strange, the answer link works great for me. The only thing i can think of is javascript is blocked or disabled in firefox or by an addon. – Jan 18 '11 at 23:30

score 2 · Answer 2 · answered Jan 18 '11 at 14:17

2

.trigger('click') in jQuery might achieve what you're trying to do. It will fire all the handlers attached to the click event.

answered Jan 18 '11 at 14:17

Robert

21,110
9
55
65

2

OPs use of `.val()` implies jQuery. – Roatin Marth Jan 18 '11 at 14:20
@jAndy, there's what looks like jQuery code in the question though. – David Tang Jan 18 '11 at 14:20
It doesnt work. I suspect it only triggers events obtain through jquery – Jan 18 '11 at 14:24
Kind of illogical to downvote, but whatever. It will only work on jQuery events, so if you have `$('something').click(function(){});` you can use `$('something').trigger('click');` – Robert Jan 18 '11 at 18:32

score 1 · Answer 3 · edited May 23 '17 at 12:19

1

In case anyone bumps into this looking for a framework agnostic way to fire any HTML and Mouse event, have a look here: How to simulate a mouse click using JavaScript?

edited May 23 '17 at 12:19

Community

1
1

answered May 27 '11 at 22:44

TweeZz

4,779
5
39
53

How do i simulate a click or keydown event?

3 Answers3