- ng-mousemove：鼠标的移动导致事件的执行。
- ng-mouseup：鼠标的向上移动导致事件的执行。
- ng-mousedown：鼠标的向下移动导致事件的执行。
- ng-mouseenter：单击鼠标键将导致事件的执行。
- ng-mouseover：鼠标悬停会导致事件的执行。
- ng-cut：剪切操作导致事件的执行。
- ng-copy：复制操作导致事件的执行。
- ng-keypress：按键会导致事件的执行。
- ng-keyup：按下向上箭头键将导致事件的执行。
- ng-keydown：按下向下箭头键将导致事件的执行。
- ng-click：单击可导致事件的执行。
- ng-dblclick：双击将导致事件的执行。
范例1：显示发生任何鼠标移动事件时的动作。这包括拖动鼠标以导致光标在屏幕上移动的事件。
<!DOCTYPE html>
< html >
< head >
< script src =
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js" >
</ script >
</ head >
< body >
< p >
Move the mouse over lsbin
to increase the Total Count.
</ p >
< div ng-app = "App1" ng-controller = "Ctrl1" >
< h1 ng-mousemove = "count = count + 1" >
Geeks for Geeks
</ h1 >
< h2 >Total Count:</ h2 >
< h2 >{{ count }}</ h2 >
</ div >
< script >
var app = angular.module('App1', []);
app.controller('Ctrl1', function ($scope) {
$scope.count = 0;
});
</ script >
</ body >
</ html >输出如下：
范例2：此示例显示了用于在Mouse Movement Event上调用函数的$ event obj。在这里, $ event对象使发生鼠标移动事件。
<!DOCTYPE html>
< html >
< head >
< script src =
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js" >
</ script >
</ head >
< body >
< p >
Mouse over Geeks for Geeks to display
the value of clientX and clientY.
</ p >
< div ng-app = "App1" ng-controller = "Ctrl1" >
< h1 ng-mousemove = "myFunc($event)" >
Geeks for Geeks
</ h1 >
< h4 >Coordinates: {{x + ', ' + y}}</ h4 >
</ div >
< script >
var app = angular.module('App1', []);
app.controller('Ctrl1', function ($scope) {
$scope.myFunc = function (gfg) {
$scope.x = gfg.clientX;
$scope.y = gfg.clientY;
}
});
</ script >
</ body >
</ html >输出如下：
范例3：这个例子显示了正在执行的动作点击时事件。在这里, 单击鼠标按钮将导致执行某些操作。
<!DOCTYPE html>
< html >
< head >
< script src =
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js" >
</ script >
</ head >
< body >
< p >
Click on lsbin to
increase the Total Count.
</ p >
< div ng-app = "App1" ng-controller = "Ctrl1" >
< button ng-click = "count = count + 1" >
Geeks for Geeks
</ button >
< h2 >Total Count:</ h2 >
< h2 >{{ count }}</ h2 >
</ div >
< script >
var app = angular.module('App1', []);
app.controller('Ctrl1', function ($scope) {
$scope.count = 0;
});
</ script >
</ body >
</ html >输出如下：
