Question

香草javascript -

document.addEventListener("click", function(){ alert('click fired');});

，角度为2 + -

 @HostListener('window: click', ['$event'])
        public iosSafariClick(e: any): void {
         alert('event fired');
        }

这种方法都不适用于iPad上的IOS Safari。

除非我点击某个按钮，超链接或任何可操作的项目，否则不会触发点击事件。

我的目标是在＆div; div元素上触发模糊事件。

为此，我尝试检查是否在HTML正文上触发了任何点击事件，并检查它是否在＆＃39; div元素上＃。

HTML＆gt;

<html>
  <body>
    <div id= 'menu'>123...</div>
  </body>
</html>

角度组件＆gt;打字稿＆gt;

 @HostListener('window: click', ['$event'])
   public iosSafariClick(e: any): void {
     if(e.target.id !== 'menu'){
       this.menu = false;  // to close menu 
     }        
   }

有没有办法使用javascript或angular来克服这个障碍？

Answer 1

使用基于触摸的设备时，发给浏览器的事件会有所不同。它还为开发人员提供了准确的用例，可以围绕它进行设计和开发。

我认为由于没有鼠标，因此不会有点击事件。

摘自MDN：为了为基于触摸的用户界面提供高质量的支持，触摸事件提供了在触摸屏或触控板上解释手指（或手写笔）活动的能力。

尝试使用： document.addEventListener('touchstart', () => console.log('touch called'));

您始终可以选择使用function () {}代替() => {}

查看完整详情：https://developer.mozilla.org/en/docs/Web/API/Touch_events

Answer 2

我忘记了更多关于Angular的信息，但是当点击映射到“窗口”时遇到了同样的问题。将监听器从“窗口”切换为“正文”，解决了Safari中的问题。

好听的人

document.querySelector('body').addEventListener('click', e => {
  console.log('clicked ', e)
// oh yeah, I'm good!
})

不良收听者

window.addEventListener('click', e => {
  console.log('clicked ', e)
// oh yeah, I'm good!
})

Window.click事件不会在IOS safari上触发 - 仅限JavaScript

2 个答案: