触摸事件未在 iOS <a> 标记上触发

Touch event not firing on iOS <a> tag

本文关键字：iOS 事件 触摸      更新时间：2023-09-26

我的网页上有一个链接，使用 target="_blank" 打开到一个新选项卡。 它还具有绑定到它的click事件，当用户单击链接时也应触发。

但是，在移动设备上（现在在iOS7上使用Chrome进行测试），当用户单击链接时，我似乎无法触发此事件。 该链接将在新选项卡中打开，但该事件似乎没有触发——尽管当我在 Chrome 上的移动模拟器中进行测试时，它确实触发了。 我尝试绑定click、touchstart和touchend事件，但似乎都不起作用。

当用户在移动设备上点击<a target="_blank">代码时，如何触发点击或触摸事件？

以下是我到目前为止使用的代码。 虽然该项目是 Angular 的，但我提供了 Angular 和 jQuery 版本，因为事件处理程序不是特定于 Angular 的。

角度版本（包括项目中的ngTouch）：

<a id="mylink" href="http://external-link.com" target="_blank"
   ng-click="functionToBeCalled()"
    >Click me!</a>

角度版本 2：

<a id="mylink" href="http://external-link.com" target="_blank"
       on-touch="functionToBeCalled()"
        >Click me!</a>
<script>
    angular.module('myModule').directive('onTouch', function () {
        return {
            scope: {onTouch: '&'},
            link: function (scope, elem, attr) {elem.bind('touchstart', function(){scope.onTouch();});}
        }
    });
</script>

在 jQuery 中等效：

<script>
    $('#mylink').bind('touchstart', function () {
        console.log("Touch event was fired!");
    });
</script>

元素的默认行为将覆盖您执行的触摸事件处理。为什么要触发触摸事件并同时具有默认链接行为？

你可以做一个 preventDefault：

 <script>
 $( "a" ).click(function( event ) {
   event.preventDefault();
   open link here with function
   handle touch here with function
 });
 </script>

并使用脚本处理所有内容。您可以通过脚本从那里在新窗口中启动链接，也可以从那里触发触摸事件。

相关文章：