文本框的字数限制功能jquery插件

木木卉

木木卉

2016-02-19 14:40

生活已是百般艰难,为何不努力一点。下面图老师就给大家分享文本框的字数限制功能jquery插件,希望可以让热爱学习的朋友们体会到设计的小小的乐趣。

打包下载

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

后来在网上闲逛的时候突然发现一个比较好的文本框的字数限制的jquery plugin,简单好用
效果如下图

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)代码如下:
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
html xmlns="http://www.w3.org/1999/xhtml"
head
title关于文本框的字数限制功能/title
script type="text/javascript" src="jquery-1.2.6.min.js"/script
script type="text/javascript" src="maxlength.js"/script
/head
body
pEnter your hobbies (50 characters)/p
textarea style="width:300px; height:150px" data-maxsize="50" data-output="status1" wrap="virtual"/textareabr /
div id="status1" style="width:300px;font-weight:bold;text-align:right"/divbr /
pEnter your postal code (6 characters)/p
input type="text" name="T1" size="15" data-maxsize="6"
/body
/html

属性解释:

data-maxsize:该文本域能够接受的最大字数.(important)
data-output:如果想实时动态显示文本框里的字数,该属性设置显示字数的span或div的id.(字数显示的颜色会随着数量变化)
如果不修改它的源文件的话,加添了js引用后,你只需要给自己的text或者textarea加上data-maxsize属性就可以了。
关于动态设置最大值
使用setformfieldsize方法:
setformfieldsize($field, maxsize, outputfieldid)
属性解释:
$field:就是被限制的文本框的JQuery对象(参考Jquery文档).
maxsize:和data-maxsize一样,该文本域能够接受的最大字数.
outputfieldid:和data-output一样.
例子:
代码如下:
script type="text/javascript"
//jQuery(document).ready(function($){ //fire on DOM ready
setformfieldsize(jQuery('#comment'), 50, 'charsremain')
/
展开更多 50%)
分享

猜你喜欢

文本框的字数限制功能jquery插件

Web开发
文本框的字数限制功能jquery插件

jQuery maxlength文本字数限制插件

Web开发
jQuery maxlength文本字数限制插件

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

jQuery 类twitter的文本字数限制带提示效果插件

Web开发
jQuery 类twitter的文本字数限制带提示效果插件

JQuery 文本框使用小结

Web开发
JQuery 文本框使用小结

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

jquery 输入框数字限制插件

Web开发
jquery 输入框数字限制插件

VB经验谈:限制输入的文本框

编程语言 网络编程
VB经验谈:限制输入的文本框

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

用JavaScript 制作多彩的弹出式说明窗口

用JavaScript 制作多彩的弹出式说明窗口

在Ubuntu上安装Brackets的步骤

在Ubuntu上安装Brackets的步骤
下拉加载更多内容 ↓