0

我使用 Dart WebUI 创建了一个包含另一个这样的组件的组件。

截屏

我对单击的期望响应是,当我单击内部组件时,它会在该内部组件内部触发并且不会影响包含它的组件。但是,内部组件上的单击事件会在内部组件和外部组件中触发。

有没有办法处理内部的点击并防止它“冒泡”到它的父元素?

<!DOCTYPE html>
<html>
  <head>
    <link rel="import" href="ColorItem.html">
  </head>
  <body>
    <element name="color-item-with-inside-color-item" constructor="ColorItemWithInsideColorItem" extends="ColorItem">
      <template>
        <style scoped>

              #inner-color-item div{
                border:5px solid WhiteSmoke;

              }

              #inner-color-item {
                  margin-top:10px; 
                  margin-bottom:0px;
              }

        </style>

        <color-item color_text="{{color_text}}" bg_color="{{bg_color}}" text_color="{{text_color}}">
           <color-item id="inner-color-item" style></color-item> <!-- THIS IS THE INNER ITEM -->
        </color-item>

      </template>      
      <script type="application/dart" src="ColorItemWithInsideColorItem.dart"></script>
    </element>
  </body>
</html>
4

1 回答 1

1

在鼠标事件evt上,您应该能够调用evt.stopPropagation()以防止冒泡。

于 2013-06-29T21:03:45.520 回答