当前位置: 首页 > 图文教程 > 网络编程 > Javascript > jQuery textarea的长度进行验证

Javascript
Javascript 学习笔记 错误处理
Javascript 类的继承实现代码
JavaScript 创建对象和构造类实现代码
JavaScript 学习小结(适合新手参考)
extjs 列表框(multiselect)的动态添加列表项的方法
javascript getElementsByName()的用法说明
Document 对象的常用方法
JS 事件冒泡 示例代码
JS 面向对象的5钟写法
JS 输入字数判断实现代码
Javascript 汉字字节判断
JavaScript 关键字屏蔽实现函数
一句话JavaScript表单验证代码
利用javascript实现一些常用软件的下载导航
jQuery 相关控件的事件操作分解
JavaScript 异步调用框架 (Part 1 - 问题 & 场景)
JavaScript 异步调用框架 (Part 2 - 用例设计)
JavaScript 异步调用框架 (Part 3 - 代码实现)
JavaScript 异步调用框架 (Part 4 - 链式调用)
JavaScript 异步调用框架 (Part 5 - 链式实现)

Javascript 中的 jQuery textarea的长度进行验证


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 348 ::
收藏到网摘: n/a

Textarea 控件不能使用form validate.js 进行判断. 扩展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值进行操作。