Verwenden Sie Angular.js, um die Anzahl der in den Textbereich eingegebenen Wörter zu begrenzen-js-Tutorial-php.cn

Verwenden Sie Angular.js, um die Anzahl der in den Textbereich eingegebenen Wörter zu begrenzen

高洛峰

Freigeben： 2016-12-09 15:46:24

Original

1202 Leute haben es durchsucht

Vorwort

Sie sind möglicherweise auf die Notwendigkeit gestoßen, die Eingabe beim Tippen zu begrenzen. In diesem Artikel wird die Methode zur Begrenzung der Anzahl der in einen Textbereich eingegebenen Wörter über Angular.js vorgestellt folgende Beispiele.

Der Beispielcode lautet wie folgt

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>AngularJS 简单应用程序--输入字数限制</title>
<!--
 @author:sm
 @email:sm0210@qq.com
 @desc:AngularJS 简单应用程序--输入字数限制
-->
</head>
<!--
 AngularJS 应用程序
 您已经学习了足够多关于 AngularJS 的知识，现在可以开始创建您的第一个 AngularJS 应用程序：
-->
<body >
<div ng-app="myTodoApp" ng-controller="myTodoCtrl">
 <h2>我的笔记</h2>
 <p><textarea ng-model="message" cols="40" rows="10" ng-readonly="ngreadonly" ></textarea></p>
 <p>
  <button ng-click="save()">保存</button>
  <button ng-click="clear()">清除</button>
 </p>
 <p>剩下字符数：<span ng-bind="left()"></span></p>
</div>
<!--引入angular-->
<script src="js/angular.min.js"></script>
<script language="javascript">
 var app=angular.module("myTodoApp",[]);
 app.controller("myTodoCtrl",function($scope){
 $scope.message="";
 $scope.ngreadonly = false;
 $scope.left = function(){
 if($scope.message.length>100){
 $scope.ngreadonly = true;
 return 0;
 }
 return 100-$scope.message.length;
 }
 $scope.clear = function(){$scope.message="";$scope.ngreadonly = false;}
 $scope.save = function(){$scope.message=""}
 });
</script>
</body>
</html>

Nach dem Login kopieren