jQuery textarea的长度进行验证

笨小白笨小白

笨小白笨小白

2016-02-19 16:00

人生本是一个不断学习的过程,在这个过程中,图老师就是你们的好帮手,下面分享的jQuery textarea的长度进行验证懂设计的网友们快点来了解吧!
扩展textarea 属性,结合jquery.validate.js,在提交表单同时,加上对textarea的长度进行验证。
1.jQuery 对textarea 长度进行验证的插件
代码如下:
//对textarea 长度进行验证
jQuery.fn.checkLength = function(parameters) {
defaults = {
min: 0
, max: 5
}
jQuery.extend(defaults, parameters);
// 当前textarea 的值
var taValue = $(this).val();
var len = taValue.length;
if (len = defaults.max) {
$(this).parent().append(showLengthError("max")).show();
window.setTimeout(function() {
$(".lenError").hide();
}, 5000);
return false;
} else if (len = defaults.min) {
$(this).parent().append(showLengthError("min"));
window.setTimeout(function() {
$(".lenError").hide();
}, 5000);
return false;
} else {
return true;
}
//todo: 当键盘输入在正确范围的时候,消除提示
}

注释:
1) 参数传递:
defaults = {
min: 0
, max: 5
}
分别用于用于接收textarea的最短和最大长度。
2) 返回值
true : 验证长度通过
false : 验证长度失败
2. 使用说明:
在页面添加js引用:
script type="text/javascript" src="../../../scripts/jquery/jquery.textarea.js"/script
示例:
在页面中
textarea id="txtContent" rows="4" cols="40"/textarea
button id="chklen"Check Textarea Length/button
当触发按钮事件的时候,我们就可以对textarea 的长度进行判断了。
代码如下:
$("#chklen").click(function(){
var bool = $("#txtContent").checkLength({
min : -1
,max: 10
});
if(bool){
alert(bool);
}
});

如果textarea是在form表单当中的,则在表单提交的同时,进行验证,条件满足的时候再进行提交。
如下示例:
代码如下:
// 判断 testarea 长度是否超出限制
var ckContent = $("#txtContentIntro").checkLength({
min : -1 //不判断是否为空
,max: 512 //最大长度512
});
// 表单验证
var b = $("#fcourseware").valid();
// 执行上传操作,上传成功后保存课件信息
if (b && ckContent ) {
// todo: submit form
}

min和max两个参数均可以不传递值,默认最小长度0,最大长度10.如果textarea不为必填项,则min 值赋予 -1.
最后通过返回bool值进行操作。
展开更多 50%)
分享

猜你喜欢

jQuery textarea的长度进行验证

Web开发
jQuery textarea的长度进行验证

用JavaScript限制textarea输入长度 (For: IE、Firefox ...)[

Web开发
用JavaScript限制textarea输入长度 (For: IE、Firefox ...)[

s8lol主宰符文怎么配

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

jquery 表单进行客户端验证demo

Web开发
jquery 表单进行客户端验证demo

jQuery 加上最后自己的验证

Web开发
jQuery 加上最后自己的验证

lol偷钱流符文搭配推荐

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

基于jQuery的表单验证插件:jValidate

Web开发
基于jQuery的表单验证插件:jValidate

jValidate 基于jQuery的表单验证插件

Web开发
jValidate 基于jQuery的表单验证插件

lolAD刺客新符文搭配推荐

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

Eclipse 走上榜首 照亮Java众生

Eclipse 走上榜首 照亮Java众生

如何清理笔记本键盘

如何清理笔记本键盘
下拉加载更多内容 ↓