Question

我有一个容器，在那个容器里我有一个按钮。

如果我点击容器我想要一些面板slideDown（已经工作）但当我点击按钮时，我不希望面板向下滑动。

这是我正在使用的代码

$(function(){
    //.sonata-purchases-container > .list-group-item
    $('.sonata-purchases-container > .list-group > .list-group-item:not(.admin-shop-resend)').click(function(event){

        var infoContainer = $(this).find('.purchases-info');
        infoContainer.slideToggle();

    });
})

然而，即使我说明了非选择器，当我点击按钮时，面板总是会下降。

我尝试在点击事件上使用目标属性，但是在按钮上可以单击按钮本身或按钮的跨度文本

按钮代码：

<button class="pull-right btn btn-default admin-shop-resend" value="somevalue">
    <span class="text">
        <i class="fa fa-refresh text-success"></i>
        Resend
    </span>
</button>

.purchases-info是向下滑动的面板

Answer 1

尝试event.stopPropagation()，它用于阻止DOM中的事件冒泡。

$(function(){
    //.sonata-purchases-container > .list-group-item
    $('.sonata-purchases-container').click(function(event){
        var infoContainer = $(this).find('.purchases-info');
        infoContainer.slideToggle();

    });
})
$(document).on('click','#pullbutton',function(event)
               {
                     event.stopPropagation();
               });

单击未在容器中单击按钮时单击“单击”

1 个答案: