Web 表单处理中的 textarea 实战

用 JQuery 库实现 textarea 中字数限制(limitNum)在1000个以内。

var formItem = document.forms['form'];
var msgElm=$(formItem.elements['Message']);
var patternElm=$('#statementRowChk');
msgElm.val('');
var limitNum = 1000;
var msg = '还可以输入' + limitNum + '字';
patternElm.text(msg);
msgElm.keyup(
    function() {
        var remain = $(this).val().length;
        if (remain > limitNum) {
            msg = '字数超过限制,请适当删除部分内容';
		$('#statementRowChk').addClass('error');
        }
        else {
            var result = limitNum - remain;
            msg = '还可以输入' + result + '字';
		$('#statementRowChk').removeClass('error');
        }
        patternElm.text(msg);
    }
);

对提示的元素增添或移删一个名为error的class属性,然后对函数进行返回false或是true来阻止或不阻止原先的事件(submit)处理:

if($('#statementRowChk').attr('class')!= undefined && $('#statementRowChk').attr('class').indexOf('error')!=-1)
{
	return false;
}
else
{
	return true;
}

HTML部分可以根据JavaScript来自行手工编写,这篇贴文就不“拷贝粘贴”了。

posted on 2009-12-07 15:50  豆豆の爸爸  阅读(704)  评论(0编辑  收藏  举报