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来自行手工编写,这篇贴文就不“拷贝粘贴”了。