javascript - 两个 OnClick 事件重叠

Question

我在元素内部有一个元素，当我单击下方的元素时，我希望 slider 打开。当我点击最外面的元素时，我希望 slider 关闭。

不幸的是，当我点击最外面的元素时，它也会点击下面的元素。有没有办法只点击最外面的元素而忽略下面元素的点击？事件在点击时触发并使用 javascript 执行。

我尝试使用 z-index，但它仍然捕获被点击的下方元素，并且因为这些函数彼此相反，所以没有任何反应。

编辑:关于“代码值(value) 1000 字”的提示

var $target = $(this).data('pos', i) //give each li an index #
    $target.data('hpaneloffsetw', $target.find('.hpanel:eq(0)').outerWidth()) //get offset width of each .hpanel DIV (config.dimensions.fullw + any DIV padding)
    $target[haccordion.ismobile? "click" : "mouseenter"](function(){
        haccordion.expandli(config.accordionid, this)
        config.$lastexpanded=$(this)
    })

    if (config.collapsecurrent){ //if previous content should be contracted when expanding current
        $('.close').click(function(){
            $target.stop().animate({width:config.paneldimensions.peekw}, config.speed) //contract previous content
        })
        $target.dblclick(function(){
            $(this).stop().animate({width:config.paneldimensions.peekw}, config.speed) //contract previous content
        })
    }

因为代码是借用的，所以没看懂太多。但基本上我希望 "click": "moustenter"函数在点击时起作用，而不会干扰 .close().click

Answer 1

听起来您需要停止让 DOM 冒泡的点击事件被父元素捕获。您可以使用 stopPropagation() 来执行此操作:

$('.close').click(function(e) {
    e.stopPropagation();
    $target.stop().animate({ width: config.paneldimensions.peekw }, config.speed);
})
$target.dblclick(function(e) {
    e.stopPropagation();
    $(this).stop().animate({ width: config.paneldimensions.peekw }, config.speed);
})