从另一个对象的单击事件中手动触发 jQuery 单击事件

Question

我正在开发一个小的网络应用程序，单击一个div(称其为元素"A"(需要更改自身和另一个div的位置(称其为元素"B"(，反之亦然。

功能将如下所示：

Click 'A' {
  A is moved some number of pixels closer to the mouse position (making use of jQuery's .pageX and .pageY event object properties)
  B's click event is manually triggered, moving it some number of pixels closer to the mouse
}

我想我会将点击事件处理程序绑定到 A 和 B。如果 A 被点击，我会手动触发 B 的点击事件(使用 jQuery 的 .trigger((，反之亦然。不幸的是，从另一个对象的处理程序中手动触发一个对象的单击事件对我不起作用 - 例如在上面的示例中，触发div B 的单击事件时，我无法检索 pageX 和 pageY 属性。

我在这里举了一个例子来说明这一点：http://jsfiddle.net/tZFNk/2/。

提前干杯并感谢您的帮助。

Answer 1

你拼错了"问题"这个词。 尝试：

$('#aQuestion').trigger('click');

而不是

$('#aQestion').trigger('click');

Answer 2

使用第一个事件的 pageX 和 pageY 属性触发事件。

$('#aQuestion').bind('click', function(e, f){
    // Use the original pageX property if it exists, else use pageX set by triggered event.
    if (e.pageX !== undefined) {
        alert('x-pos: ' + e.pageX + ', y-pos: ' + e.pageY);
    } else {
        alert('x-pos: ' + f.pageX + ', y-pos: ' + f.pageY);
    }
});
$('#aDiv').bind('click',function(e){
    // Trigger event on #aQuestion with the current click coordinates.
    $('#aQuestion').trigger('click', { pageX: e.pageX, pageY: e.pageY });
    alert('Nothing happens!')
});

http://jsfiddle.net/tZFNk/20/

Answer 3

$('#aQuestion').click();

或

$("#aQuestion").trigger('click');

您有错别字

http://jsfiddle.net/tZFNk/7/

Answer 4

事件属性似乎没有正确传播，正如 nachito 在他的响应中已经确定的那样。但是，您不必构造新对象并将其赋值，只需在触发器函数中传递"e"对象：

$('#aQuestion').bind('click',function(e, evt){
    var pageX = e.pageX || evt.pageX;
    var pageY = e.pageY || evt.pageY;
    alert('x-pos: ' + pageX + ', y-pos: ' + pageY);
});
$('#aDiv').bind('click',function(e){
    $('#aQuestion').trigger('click', e);
    alert('Nothing happens!')
});

Answer 5

    $(document).ready(function(){
        $("#button2").each(function(){
            var buttonOld = this;
            $('#button1').bind('click',function(){$(buttonOld).trigger('click')});
        })
    })