Angular.js를 사용하여 텍스트 영역에 입력되는 단어 수를 제한하세요.-JS 튜토리얼-php.cn

Angular.js를 사용하여 텍스트 영역에 입력되는 단어 수를 제한하세요.

高洛峰

풀어 주다： 2016-12-09 15:46:24

원래의

1202명이 탐색했습니다.

머리말

입력 시 입력을 제한해야 하는 경우가 있을 수 있습니다. 이 글에서는 Angular.js를 통해 텍스트 영역에 입력되는 단어 수를 제한하는 방법을 소개합니다. 다음 예.

예제 코드는 다음과 같습니다

<!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>

로그인 후 복사