I have two div :

<div id="div1"></div>
<div id="div2"></div>

and i have the following jquery for div1:

 $('#div1').click(function(e)
{
alert(e.pageX + ' ' + e.pageY);
});

. Now, i want to trigger click eventhandler of div1 to execute on clcicking of div2. For this i wrote:

$('div2').click(function(e)
{
$('#div1').trigger('click');
});

It's working fine but the problem is i am not able to get e.pageX and e.pageY in the event handler of div1. How to pass eventdata of div2 click event handler i.e e to div1 click event handler. Please help.

I have two div :

<div id="div1"></div>
<div id="div2"></div>

and i have the following jquery for div1:

 $('#div1').click(function(e)
{
alert(e.pageX + ' ' + e.pageY);
});

. Now, i want to trigger click eventhandler of div1 to execute on clcicking of div2. For this i wrote:

$('div2').click(function(e)
{
$('#div1').trigger('click');
});

It's working fine but the problem is i am not able to get e.pageX and e.pageY in the event handler of div1. How to pass eventdata of div2 click event handler i.e e to div1 click event handler. Please help.

• javascript
• jquery

• Woah, what happened with the title? I can only assume that was a mistake. – David Tang Commented Feb 2, 2011 at 11:31
• I don't think it is possible due to the trigger function only running the function you specified and not actually firing the event. This means that pageX/Y will not exist. e won't even exist. – Olical Commented Feb 2, 2011 at 11:33
• @Wolfy, e does exist as jQuery creates one as part of .trigger() but pageX and pageY will be undefined. – David Tang Commented Feb 2, 2011 at 11:38
• @Niraj, no worries, it just made me read the question 5 times ;) – David Tang Commented Feb 2, 2011 at 11:39
• Oh I see. Thanks for clearing that up. I don't use jQuery too much anymore :] – Olical Commented Feb 2, 2011 at 11:39

2 Answers 2

Since the event you want to trigger is of the same type, you can pass the old event object right along:

$('#div2').click(function (e) {
    $('#div1').trigger(e);
});

For events of a different type, you may create a custom event object:

$('#div2').mouseenter(function (e) {
    var newE = jQuery.Event('click');
    newE.pageX = e.pageX;
    newE.pageY = e.pageY;
    $('#div1').trigger(newE);
});

jQuerys .trigger()^help should be the answer here. You can pass in event-strings (along with parameters) aswell as event objects.

$('#div2').click(function(e) {
    $('#div1').trigger(e);
});