美文网首页Angular.js专场
angularJS 实现长按不触发点击事件 可以复制剪贴

angularJS 实现长按不触发点击事件 可以复制剪贴

作者: Skywang | 来源:发表于2017-12-01 16:35 被阅读28次
  • 这两天提交项目遇到一个需求,就是测试需要复制文字内容 但是不触发点击事件, 在网上没有找到类似的方法, 就自己想到一个方法 ,通过点下鼠标和抬起鼠标的时间差来判断是否触发点击事件。
  • 废话不多说 直接上代码 首先是html界面

<span ng-mousedown="skipDown()" ng-mouseup="skipUp($index)"  style="cursor: pointer;" data-toggle="modal" ><a>{{resource.content}}</a></span>
                                
  • 这里data-toggle="modal"是Bootstrap的模态框类名
    主要是ng-mousedown="skipDown()" ng-mouseup="skipUp($index)"这两个方法 ng-mousedown是按下按钮时触发的方法, ng-mouseup是松开按钮时触发的方法
// 按下按钮触发的方法 获取按下按钮的时间
$scope.skipDown = function() {
    $scope.skipDownTime = Date.parse(new Date());
}
// 松开按钮的触发方法 获取松开按钮的时间
$scope.skipUp = function(index) {
    $scope.skipUpTime = Date.parse(new Date());
  // 这里判断松开按钮和点下按钮直接的时间差 是否小于0.5秒
      小于0.5秒则触发skipInfor的方法
    if($scope.skipUpTime - $scope.skipDownTime < 500) {
       $scope.skipInfor(index);// 这里是具体方法
    }
}
                                

这样你就可以进行复制粘贴了,不用担心复制的时候会触发按钮方法

希望对大家有帮助 有更好的方法希望大家多多提出 !!

相关文章

网友评论

    本文标题:angularJS 实现长按不触发点击事件 可以复制剪贴

    本文链接:https://www.haomeiwen.com/subject/wamibxtx.html