Question

我的网页上有一个链接，使用target="_blank"打开一个新标签页。当用户点击链接时，它也会绑定一个click事件。

但是，在移动设备上（目前正在iOS7上使用Chrome进行测试），当用户点击链接时，我似乎无法触发此事件。该链接会在新选项卡中打开，但事件似乎没有触发 - 但是当我在Chrome上的移动模拟器中进行测试时，确实如此。我尝试绑定click，touchstart和touchend事件，但似乎都没有。

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

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

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

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

Angular版本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>

Answer 1

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

你可以做一个preventDefault：

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

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

触摸事件未在iOS <a> tag</a>上触发

1 个答案: