如果touchend事件在任何元素上将CSS“显示”设置为“阻止”,则不会触发Click事件

时间:2019-08-01 04:43:40

标签: javascript html safari dom-events ios13

假设我们有两个单独的元素A和B

  1. 在元素A上将CSS“显示”设置为“无”
  2. 在元素B中,我们设置了两个事件侦听器。一个用于处理“ touchend”事件,此处理程序将在元素A上将CSS“显示”设置为“阻止”。另一个用于处理“ click”事件。

用户点击元素B时,仅触发“ touchend”事件。

我只能在Safari,iOS13上重现此错误

我将“ touchend”替换为“ mouseup”,并且触发了“ click”事件

<style>
    #touch, #show {
      width: 100px;
      height: 100px;
    }

    #touch {
      background-color: #fcf;
      cursor: pointer;
    }

    #show {
      background-color: #cfc;
      display: none;
    }
  </style>

  <div id="touch">test touch</div>
  <div id="show">test show</div>



    <script>
        let touch = document.getElementById('touch');
        let show = document.getElementById('show');

        show.addEventListener('click', ()=>{ show.style.display="none"})
        touch.addEventListener('click', ()=>{ console.log('click')})
        touch.addEventListener('touchend', ()=>{
        setTimeout(show.style.display="block"; console.log('touch'))
        })
      </script>

“点击”事件未触发

0 个答案:

没有答案