利用Angular.js限制textarea输入的字数
前言
大家可能都遇到过在输入的时候做出限制的需求,本文介绍的是通过Angular.js限制textarea输入字数的方法,有需要的朋友们可以参考以下实例。
实例代码如下
<!DOCTYPEhtml> <html> <head> <metacharset="utf-8"/> <title>AngularJS简单应用程序--输入字数限制</title> <!-- @author:sm @email:sm0210@qq.com @desc:AngularJS简单应用程序--输入字数限制 --> </head> <!-- AngularJS应用程序 您已经学习了足够多关于AngularJS的知识,现在可以开始创建您的第一个AngularJS应用程序: --> <body> <divng-app="myTodoApp"ng-controller="myTodoCtrl"> <h2>我的笔记</h2> <p><textareang-model="message"cols="40"rows="10"ng-readonly="ngreadonly"></textarea></p> <p> <buttonng-click="save()">保存</button> <buttonng-click="clear()">清除</button> </p> <p>剩下字符数:<spanng-bind="left()"></span></p> </div> <!--引入angular--> <scriptsrc="js/angular.min.js"></script> <scriptlanguage="javascript"> varapp=angular.module("myTodoApp",[]); app.controller("myTodoCtrl",function($scope){ $scope.message=""; $scope.ngreadonly=false; $scope.left=function(){ if($scope.message.length>100){ $scope.ngreadonly=true; return0; } return100-$scope.message.length; } $scope.clear=function(){$scope.message="";$scope.ngreadonly=false;} $scope.save=function(){$scope.message=""} }); </script> </body> </html>
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。