ムーズダウン。兄弟イベントの伝播。ターゲット

Question

Mousedownイベントを処理する「Aspolute」の「位置絶対」を備えた2つの兄弟ノードがあります。 「Div 2」の透明な領域（写真上）をクリックしているときに、「Div 1」のハンドラーをトリガーするにはどうすればよいですか。

Answer 1

重複する要素が動的である場合、問題の2つの重複要素は「兄弟」であるため、通常のイベントの泡立ちを使用してこれを達成することはできないと思います。

私は同じ問題を抱えていたので、ユーザーのマウスの位置が同じ領域内にあるかどうかをテストする最もヒットした風景でそれを解決することができました。

function _isMouseOverMe(obj){
    var t = obj.offset().top;
    var o = obj.offset().left;
    var w = obj.width();
    var h = obj.height();
    if (e.pageX >= o+1 && e.pageX <= o+w){
        if (e.pageY >= t+1 && e.pageY <= t+h){
            return true;
        }
    }
    return false
}

Answer 2

3つのイベントハンドラーを使用します。1つはdiv1用、もう1つはdiv2用、もう1つはcontentareaに使用します。 contentareaハンドラーは、div2ハンドラーが呼び出されないように伝播を停止する必要があります。 div2ハンドラーはdiv1ハンドラーを呼び出す必要があります。

function div1Click (e)
{
    // do something
}
function div2Click (e)
{
    div1Click.call(div1, e);
}
function contentAreaClick (e)
{
    e = e || window.event;
    if (e.stopPropagation) e.stopPropagation();
    e.cancelBubble = true;
    // do something
}
div1.onclick = div1Click;
div2.onclick = div2Click;
contentArea.onclick = contentAreaClick;