1

单击或向左滑动时,按钮在触摸屏上完美运行:

  <button ng-click="click(it)" ng-swipe-left="leftSwipe(it)" />

但是,在通过鼠标单击和左拖动组合完成左滑的桌面上,也会触发 click 事件。

有什么办法可以压制这个吗?

4

1 回答 1

2

好吧,我没有发现任何简单的东西,所以这里有一种解决方法和一种半抑制,两者都依赖于 $timeout,但鉴于你依赖于人机交互,我认为我们没问题。

半抑制:我们要忽略这个摘要周期的点击并返回到下一个摘要周期收听事件。

$scope.leftSwipe = function(event){
        angular.element(event.target).unbind('click');
        $timeout(function(){angular.element(event.target)
             .bind('click', function(it) {$scope.click(it);})},0);
      };

在这里,我们将事件传递给'left-swipe'函数以获取目标元素,如果您不想将事件作为参数传递(取决于您的代码),您可以使用查询($('#yourButtonId'))获取元素硬编码id或不带 ( document.querySelector('#yourButtonId')) 并改用它。请注意,在此处重新处理单击事件将需要再次传递参数(在您的情况下为“”?),这就是为什么它被包装在另一个函数中而不是直接调用的原因。

解决方法:我认为这要简单得多,但这取决于您和代码。

var hasSwiped = false;

$scope.click = function(event){
  if (!hasSwiped){
    ...
  }
};
$scope.leftSwipe = function(event){
  hasSwiped = true;
  $timeout(function(){ hasSwiped = false; },1000);
};

在这里,我们简单地创建一个变量“hasSwiped”,并在滑动后将其设置为 true,并仅在触发“click”事件后将其重置为 false(这取决于应用程序,但在滑动和点击之间的一秒钟对我来说听起来很合理) . 在点击事件中,只要检查这个标志是否被提升。
希望这有帮助,祝你好运!

于 2015-05-12T18:03:46.827 回答