AngularJS实现的输入框字数限制提醒功能示例

本文实例讲述了AngularJS实现的输入框字数限制提醒功能。分享给大家供大家参考，具体如下：

！DOCTYPE html html head lang=' en ' meta charset=' UTF-8 ' titlewww.jb51.net AngularJS字数提示/标题/头部样式* { margin 33600划水：0;}输入，按钮，textarea，选择{ outline : none } text area { resize : none }。内容{宽度：350像素高度：150 pxfont-size :18 px文本-缩进：40像素；溢出-y:隐藏；溢出-x:隐藏；} .内容：悬停{边框：1 px实心# 00 ffff光标：指针指针；} .顶部{垂直对齐：顶；} .fontColor { color: # eee}。表t TD {边距-右：20 px}/style body ng-app=' myApp ' ng-controller=' my control ' table class=' table ' table ' table ' t ' tr TD class=' top '退货说明nbsp :/TD tdtextarea id=' Sayid ' class=' content ' ng-model=' say ' ng-key up=' changeText()'/textarea/TD/tr TD/TD class=' font color '你还可以输入{{textLength}}字/TD/tr/table/body脚本类型=' text/JavaScript ' src=' http :/js/jquery-1。8 .3 .js/script脚本类型=' text/JavaScript ' src=' http :/js/angular。量滴js '/script脚本类型=' text/JavaScript ' var app=angular。模块(' myApp '，[])；app.controller('myControl '，function($ scope){ $ scope。textlength=10$ scope。更改文本=函数(){ var length=$(' # Sayid ').val().长度；//使用$scope.say.length的时候，输入空格的时候没有计算空格长度console.log(长度);$ scope。textlength=10长度；if($ scope。textlength=0){ $ scope。text length=0；$('#sayId ').val($scope.say.slice(0，10))；} } });/script/html运行效果：

PS:这里再为大家推荐2款功能相似的在线工具供大家参考：

在线字数统计工具：http://工具。JB 51。net/code/zishhutonji

在线字符统计与编辑工具：http://工具。JB 51。net/code/char _同济

更多关于AngularJS相关内容感兴趣的读者可查看本站专题： 《AngularJS指令操作技巧总结》 、 《AngularJS入门与进阶教程》 及《AngularJS MVC架构总结》

希望本文所述对大家AngularJS程序设计有所帮助。