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

我有一段HTML：

<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上使用一个单击函数，并从该单击函数中排除除按钮之外的所有子项。此外，按钮已经有一个函数（提交表单），这必须保留按钮事件处理程序

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

---

如何执行此操作？

您可以使用e.preventDefault（）防止冒泡到所有元素，并手动触发单击按钮。

---

更好的方法是只将一个点击事件绑定到按钮。

那么为什么不将事件处理程序附加到按钮上呢？很抱歉，我将编辑帖子，这可能有点让人困惑：p但是，那么为什么不直接在按钮上绑定事件呢？您可以将多个处理程序绑定到一个元素，这样就不会阻止您将另一个处理程序添加到您并不真正理解的按钮，并且您提出了错误的问题。您真正想知道的是如何防止提交表单的默认操作，以及在单击按钮时执行其他操作。