Question

我搜索了几个例子，但我找不到任何能解决我问题的东西。我的问题很简单，我需要一个带有两个事件的元素，一个点击和双击事件。我这样做，但事件绑定在一起，我不需要这个.. 我需要点击元素两次（doubletap），选择元素的状态，如果我点击一次元素被取消选择，现在不被选中。我也这样做，结果是一样的，一起发生的事件...... 有人知道怎么做??

由于

Answer 1

试试这个：

请参阅Tap and Double Tap Ionic上Vikas Gautam（@Vikasg7）的笔CodePen。

以下是指令： -

  SepTap.$inject = ["$ionicGesture"]
  function SepTap(IonicGesture) {
      return {
         restrict: "A",
         link: linkFunc
      }

      function linkFunc(scope, ele, attrs) {
         var isDoubleTap = false

         var tap = IonicGesture.on("tap", onTap, ele)
         var doubleTap = IonicGesture.on("doubletap", onDoubleTap, ele)

         function onTap() {
            setTimeout(onTap, 250)
            function onTap() {
               if (isDoubleTap) return
               scope.$apply(attrs.stTap)
            }
         }

         function onDoubleTap() {
            isDoubleTap = true
            scope.$apply(attrs.stDoubleTap)
            // onTap is called twice almost immediadetly with a delay
            // of 250ms, so using a delay of 300ms (50ms more) to 
            // reset isDoubleTap to false.
            setTimeout(function () { isDoubleTap = false }, 300)
         }

         ele.on("$destroy", function () {
            IonicGesture.off(tap, "tap", onTap)
            IonicGesture.off(doubleTap, "doubletap", onDoubleTap)
         })
      }    
   }

请检查上面的codepen以获得完整实施。

Answer 2

http://www.gajotres.net/ionic-framework-series-13-touch-gestures/在评论部分中说，离子已禁用onTap相关延迟，该延迟用于分别检测这些类型。没有提到任何解决办法，只是说不可能将它们开箱即用。

摘录文字：

不幸的是，一年前所做的更改从Ionic应用程序中删除了300毫秒的点击延迟。我很遗憾地说，因为现在应用程序无法正确检测同一元素上的点击/双击。它们都会触发。

Answer 3

我用

解决了这个问题

         $scope.onDoubleTap = function(event){
                setTimeout(function(){

                    if(!$(element).hasClass("selected")) {
                        $(element).addClass("selected");

                    ......
                    }
                },400);
            };
        $scope.onTap = function(event){

                if($(element).hasClass("selected")){
                     $(element).removeClass("selected");

                    .....
                }


        };

结合tap和doubletap离子事件

3 个答案: