ホームページ > ウェブフロントエンド > jsチュートリアル > AngularJS ng-blur ディレクティブの詳しい説明と簡単な例

AngularJS ng-blur ディレクティブの詳しい説明と簡単な例

高洛峰
リリース: 2017-01-10 11:18:15
オリジナル
1423 人が閲覧しました

AngularJS ng-blur ディレクティブ

AngularJS の例

入力ボックスがフォーカスを失ったときに式を実行する (onblur):

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="">
 
<input ng-blur="count = count + 1" ng-init="count=0" />
 
{{count}}
 
<p>实例中 "count" 变量记录了失去焦点的次数。</p>
 
</body>
</html>
ログイン後にコピー


実行結果:

AngularJS ng-blur 指令详解及简单实例

0

例では「カウント」 " 変数はフォーカスが失われた回数を記録します。

定義と使用法

ng-blur ディレクティブは、HTML 要素がフォーカスを失ったときに実行する必要がある式を AngularJS に伝えるために使用されます。
AngularJS の ng-blur ディレクティブは、ネイティブの onblur イベントをオーバーライドしません。このイベントがトリガーされると、ng-blur 式とネイティブの onblur イベントの両方が実行されます。

構文