2016-07-27 5 views
1

私はこの簡単な例を使って、カスタムアクションのためにマウスの右クリックをキャプチャします。デフォルトのコンテキストメニューが表示されてはいけません。私はここで質問を読んでいます。残念ながら、コンテキストメニューに組み込まれたブラウザを開くことができません。私はここで単純なものが欠けていると確信しています。あなたは、コンテキストメニューを無効にしようとしている場合は、あなたがするためにcontextmenuイベントに耳を傾ける必要がある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(); 
    } 
    }; 
}]); 

答えて

2

(plunker http://plnkr.co/edit/YieQh23xNUFmPrjZscGBを参照してください)それをやめなさい。

が角でこれを実現するには、多分あなたは、カスタムディレクティブを追加する必要があります。

app.directive('noContextMenu', [function() { 
    return function(scope, ele, attr){ 
    ele.on('contextmenu', function(e) { 
     e.preventDefault(); 
    }); 
    } 
}]); 
<p no-context-menu >Click me!</p> 
+0

は完璧な作品!アップレートプランナーhttp://plnkr.co/edit/YieQh23xNUFmPrjZscg – BetaRide

関連する問題