[AngularJS] 事件(Event)

2016-04-14

1826
0

http://jsbin.com/yacada/edit?html,js,output

滑鼠事件

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body ng-app="myApp" ng-controller="myController">
  <label>{{ type }}<label>
  <br /><br />
  <button ng-click="myOnClick()">Click Me</button>
  <br />
  <label ng-mousemove="myOnMouseMove()">Hover Me</label>
  <br /> 
  <label ng-mouseover="myOnMouseOver()">Hover Me</label>
  <br />
  <label ng-mouseenter="myOnMouseEnter()"
         ng-mouseover="myOnMouseOver()"
         ng-mouseleave="myOnMouseLeave()">Hover Me</label>
</body>
</html>

var app = angular.module("myApp",[]);
app.controller("myController", function($scope) {
  $scope.type = "Control";
  $scope.myOnClick = function() {
    $scope.type = "Click"; 
  };
  $scope.myOnMouseMove = function() {
    $scope.type = "MouseMove"; 
  };
  $scope.myOnMouseEnter = function() {
    $scope.type = "MouseEnter"; 
  };
  $scope.myOnMouseOver = function() {
    $scope.type = "MouseOver"; 
  };
  $scope.myOnMouseLeave = function() {
    $scope.type = "MouseLeave"; 
  };
});

Write By Charley Chang

新手發文，若有錯誤還請指教，
歡迎留言或Mail✉給我