手机端 使用touch事件 按下 与 抬起不是同一个元素 但触发抬起获取的是按下的元素

Question

<div
        v-for="(item, index) of list"
        :key="index"
        class="jigsaw-single g"
        :class="`s-${index} g1-${item}`"
        @touchstart="touchstart(item, index, $event)"
        @touchend="touchend(item, index, $event)"
      >
        {{ item }}
      </div>


touchstart(item, index) {
      console.log('touchstart', index)
      this.startIndex = index
    },
    touchend(item, index) {
      console.log('touchend', index)
      this.endIndex = index
      console.log(this.startIndex, this.endIndex)
}

比如 当我从1开始触发touchstart 随后手指触摸移动到 9 然后抬起触发 touchend事件 但是触发的却是 元素1 的touchend事件 而不是 元素9 的

求助大佬们 这是为什么啊

Answer 1

这难道不对吗，释放鼠标的时候判断一下鼠标位置。不在标签内就不做行为可以吧？