javascript中子元素事件继承问题

Question

自己尝试着写了一个计算器，span 为 div的子元素，给div绑定了click事件，但点击span时浏览器报错，无法实现预期效果。

html：

<div class = "container col-sm-offset-5">

          <div class="row " id = "display-sec">
            <div class="col-sm-4" style="background-color:black">
              <span id = "distxt">0</span>
            </div>
          </div>

          <div class="row">
            <div class="col-sm-1  calButton ">
              <span class="calValue" id="ac">AC</span>
            </div>
            <div class="col-sm-1 calButton " >
              <span class="calValue" id="negative">+/-</span>
            </div>
            <div class="col-sm-1 calButton " >
              <span class="calValue" id="percent">%</span>
            </div>
            <div class="col-sm-1 calButton  lastcol" >
              <span class="calValue" id="divide">/</span>
            </div>
        </div>

javascript click事件绑定：

当点击span时无法触发,div绑定事件。
PS:小白不想用JQ，谢谢！

Answer 1

不应该用e.target，而应该使用e.currentTarget，因为你是通过冒泡上来的，而不是得到目标点击元素