首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >AngularJS单击TouchStart

AngularJS单击TouchStart
EN

Stack Overflow用户
提问于 2014-07-15 04:16:30
回答 2查看 10K关注 0票数 5

Angular Touch ngTouch使点击发生在触摸释放时。

有没有办法在touch start上点击?

下面的fast-click指令似乎在触摸屏上做了我想做的事情,但它在鼠标单击时不起作用。

代码语言:javascript
复制
myApp.directive('fastClick', ['$parse', function ($parse) {
    return function (scope, element, attr) {
      var fn = $parse(attr['fastClick']);
      var initX, initY, endX, endY;
      var elem = element;

      elem.bind('touchstart', function (event) {
          event.preventDefault();
          initX = endX = event.touches[0].clientX;
          initY = endY = event.touches[0].clientY;
          scope.$apply(function () { fn(scope, { $event: event }); });
      });
    };
  }
]);
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2014-07-15 04:21:53

click添加到touchstart事件- event.preventDefault()将取消该事件发生两次:

代码语言:javascript
复制
elem.bind('touchstart click', function (event) {

我在一个应用程序中使用的快速单击代码是:

代码语言:javascript
复制
app.directive("ngMobileClick", [function () {
    return function (scope, elem, attrs) {
        elem.bind("touchstart click", function (e) {
            e.preventDefault();
            e.stopPropagation();

            scope.$apply(attrs["ngMobileClick"]);
        });
    }
}])

并像这样使用:ng-mobile-click="myScopeFunction()"

票数 14
EN

Stack Overflow用户

发布于 2014-12-31 22:25:37

tymeJV的答案是正确的,但是当我试图重写ngClick指令时,这个行为与ngTouch模块发生了冲突--一些点击开始触发两次。原因很简单,ngTouch关心这些东西,但不幸的是有一个bug。

在touchstart事件处理程序中,而不是:

代码语言:javascript
复制
  var touches = event.touches && event.touches.length ? event.touches : [event];

它应该有这样的内容:

代码语言:javascript
复制
var touches = null;
  if (event.touches && event.touches.length) {
      //AC: this is original library case
      touches = event.touches;
  } else if (event.originalEvent && event.originalEvent.touches && event.originalEvent.touches.length) {
      //AC: this is fix actually working
      touches =  event.originalEvent.touches;
  }else{
    touches = [event];
  }

例如,由于某些原因,事件的touches字段未定义,但event.originalEvent.touches没有问题。

在touchend中也应该这样做:

代码语言:javascript
复制
var touches = null;
  if (event.changedTouches && event.changedTouches.length) {
      //AC: this is original library case
      touches = event.changedTouches;
  } else if (event.originalEvent && event.originalEvent.changedTouches && event.originalEvent.changedTouches.length) {
      //AC: this is fix actually working
      touches = event.originalEvent.changedTouches;
  } else {
      touches = [event];
  }

ngTouch的版本是1.2.27。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/24745167

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档