Question

我对HTML，CSS，JS很陌生。因此，请回答我的菜鸟问题。

我正在开发UI应用程序。

UI元素之一是水平条，该条位于div内，其中包含图像和图像名称。用户可以在栏上的任意位置单击，然后调用js功能（例如A）。

我现在需要在此栏中添加其他图像。当用户鼠标单击该图像时，将调用一个js函数（例如B）。我在这里看到一个问题。

由于此图像是条形图的一部分，因此单击它会调用A。我需要停止此调用，并确保用户单击此新图像时仅调用B。单击栏的任何其他部分仍会呼叫A。

如何实现？

Answer 1

调用B时应使用e.stopPropagation，以防止事件冒泡到条形单击处理程序。

bOnClick = e => {
    e.stopPropagation();
    // Do stuff...
}