Question

在我的项目中，我使用的是AngularJS v1.2.16和Bootstrap v3.1.0。

以下代码在桌面端正常工作，但在通过平板电脑（ipad）尝试时却没有在平板电脑的情况下，只有在＆＃34; tabbing＆＃34;再次在div元素上，它被解雇了。

  <div ng-click="selectObject($index)" ng-class="selectedObject($index)" class="check-obj" ng-mouseover="showwhiteobj = true;" ng-mouseleave="showwhiteobj = false;">
<span ng-hide="selectedObject[$index]">
   <span ng-hide="showwhiteobj"><img src="img/{{imagename}}.svg"/></span>
   <span ng-show="showwhiteobj"><img src="img/{{imagename}}-white.svg"/></span>
</span>
</div>

selectObject只是将数组设置为true或false：

    $scope.selectObject = function (objIndex) {
        if ($scope.selectObject[objIndex]) {
            $scope.selectObject[objIndex] = false;
        } else {
            $scope.selectObject[objIndex] = true;
        }
    };

selectedObject会返回一个“活跃的＆＃39;或未定义（在ng-class中使用）：

   $scope.selectedObject = function (objindex) {
        if ($scope.selectedObject[objindex]) {
            objindex = 'active';
        } else {
            return undefined;
        }
        return objindex;
    };

有趣的是，当删除时

ng-mouseover =＆＃34; showwhiteobj = true;＆＃34; ng-mouseleave =＆＃34; showwhiteobj = false;＆＃34;

一切正常（在台式机和平板电脑上），遗憾的是我无法在悬停时使用不同的图像。

使用ng-mouseover或ng-mouseenter尝试使用ng-mouseover或ng-mouseenter时，它只能在平板电脑上工作 - 在平板电脑上只能通过额外的工作来进行选择＆＃34; tab / click＆＃34;在对象上。

我在控制台方面没有看到任何错误： - （

任何想法或解决方法？

非常感谢你们！

Answer 1

几天前我也被它咬了。在IO上，当您点击时，首先触发鼠标悬停（如果在代码中处理），然后触发单击事件。这就是为什么当你删除鼠标事件处理程序时，代码开始工作。我建议使用ng-touch来处理触摸事件，它可以正确处理所有这些奇怪的事情。

阅读this文章了解详情。

Answer 2

是否包含角度触控模块？ Doc here

Answer 3

ng-mouseover和ng-mouseleave在触摸屏上不起作用。它可以在笔记本电脑或台式机上正常工作。

您可以尝试使用ng-touch。 Try this Link

希望它有所帮助......！

在平板电脑上使用ng-mouseenter或ng-mouseover时，点击不点火

3 个答案: