利用Angular.js限制textarea输入的字数

2019-11-20 08:42:32

字体：大中小

来源：转载

供稿：网友

前言

大家可能都遇到过在输入的时候做出限制的需求，本文介绍的是通过Angular.js限制textarea输入字数的方法，有需要的朋友们可以参考以下实例。

实例代码如下

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

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流。

上一篇：javascript淘宝主图放大镜功能

下一篇：一个极为简单的requirejs实现方法