jQuery单击函数排除除了一个之外的子项

Question

我有这段HT​​ML：

<div class="pop-up rooster-toevoegen">
    <div class="pop-up-container">
        <div class="pop-up-header clearfix">
            <div class="pop-up-title">
                Rooster toevoegen
            </div>
            <div class="sprite close"></div>
        </div>
        <div class="pop-up-content clearfix">
            <form id="rooster-toevoegen-form" class="form rooster-toevoegen-form">
                <div class="afdeling-container">
                </div>
                <div class="date-container">
                </div>
                <div class="button-container clearfix">
                    <button value="" name="rooster-toevoegen-button" class="rooster-toevoegen-button button-green">Toevoegen</button>
                </div>
            </form>
        </div>
    </div>
</div>

现在我想要.rooster-toevoegen上的点击功能，并从该点击功能中排除所有孩子除了按钮。此按钮还有一个功能（提交表单），这必须保留按钮事件处理程序。

背景： 这是一个带有表单内部的弹出窗口。当用户点击弹出窗口旁边的弹出窗口时必须关闭。点击弹出窗口时，如果我没有将孩子排除在点击事件之外，则不会。但是当用户点击按钮时，表单必须提交。因此，不应从按钮中排除按钮并执行自己的操作。

我该怎么做？

Answer 1

您可以使用e.preventDefault（）阻止冒泡到所有元素，并手动触发单击按钮。 更好的方法是仅将一个单击事件绑定到按钮。