preventDefault不停止默認的鼠標手勢

我有這個簡單的角度示例，我想捕獲一個鼠標右鍵單擊自定義操作。默認的上下文菜單不能顯示。我在SO閱讀這些問題。不幸的是，我無法阻止它打開內置菜單中的瀏覽器。我確信我在這裏錯過了一些簡單的東西。（見plunker http://plnkr.co/edit/YieQh23xNUFmPrjZscGB）preventDefault不停止默認的鼠標手勢

的index.html

<!DOCTYPE html> 
<html lang="en"> 

    <head> 
    <meta charset="UTF-8" /> 
    <title>My Plunk</title> 
    <script data-require="[email protected]" data-semver="2.2.0" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.js"></script> 
    <script src="script.js"></script> 
    </head> 

    <body ng-app="plunker" ng-controller="myController"> 
    <p ng-mousedown="mouseClicked($event)">Click me!</p> 
    </body> 

</html>

的script.js

var app = angular.module('plunker', []); 

app.controller('myController', ['$scope', '$log', function($scope, $log) { 
    $scope.mouseClicked = function(event) { 
    if (event.button===2) { 
     $log.debug('right mouse click detected') 
     // don't do anything else 
     event.preventDefault(); 
     event.stopPropagation(); 
    } 
    }; 
}]);

來源

2016-07-27 BetaRide

如果要禁用上下文菜單中，你需要聽contextmenu事件，以停下來。

要在角度實現這一點，也許你需要添加自定義指令：

app.directive('noContextMenu', [function() { 
    return function(scope, ele, attr){ 
    ele.on('contextmenu', function(e) { 
     e.preventDefault(); 
    }); 
    } 
}]);

<p no-context-menu >Click me!</p>

來源

2016-07-27 14:45:58 MMhunter

運行完美！ Upate plunker http://plnkr.co/edit/YieQh23xNUFmPrjZscGB – BetaRide

preventDefault不停止默認的鼠標手勢

回答

相關問題