防止內部div觸發外部div事件

Question

我創建了一個基本的行點擊和拖動選擇功能。 然而，問題是在列上單擊並拖動可以打開和關閉它們。 我正在尋找某種return false或stopPropagation某種形式，但我無法讓這些工作。

return false確實有助於阻止文本選擇，但它不會阻止列選擇影響行選擇。

為了演示， http://jsfiddle.net/sjwcztre/ ，嘗試從右側選擇行 - 沒問題。 但是嘗試選擇存在列文本的行 - 它變得不穩定

    var isMouseDown = false;

$('.row').each(function () {
    $(this).mousedown(function () {
        isMouseDown = true;
        rowClickHandler(this);
        console.log('mdown');
        return false;
    })
        .mouseover(function () {
        if (isMouseDown) rowClickHandler(this);
    });

    $(document).mouseup(function () {
        isMouseDown = false;
    });
});

function rowClickHandler(obj) {
    $(obj).toggleClass('highlight');
}

Answer 1

檢查這個，看看它是否適合你。 基本上，您需要為行的子項創建事件並以不同方式處理它們，添加hoverChild控件變量有助於防止父項再次激活懸停。