生活随笔
收集整理的這篇文章主要介紹了
限制Textarea文本域内容的长度
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
通過charCodeAt()函數獲取字符的Unicode值,根據Unicode值得范圍判斷字符串中是否包含中文符,包含temp+2,不包含temp+1;
在body標簽的onload加載事件中調用JavaScript中的函數,并在<textarea>的onkeyup事件和onkeydown事件中調用JavaScript中的函數,實時跟蹤用戶輸入的內容長度,在文本域之后顯示;
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><base href="<%=basePath%>"><title>限制Textarea文本域內容的長度</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><!--<link rel="stylesheet" type="text/css" href="styles.css">--><script language="javascript"> function limitTextarea(){var max=20;//最多可輸入20個字符,中文占2個字節 var areaStr = document.getElementById("str").value;var temp=0;for(var i=0;i<areaStr.length;i++){ //可能包含中文,需要循環判斷 var code = areaStr.charCodeAt(i); //轉換為Unicode值 if(code>255){ //大于255的為中文字符temp=temp+2;}else{temp=temp+1;}if(temp>max){ //如果字符長度超過指定長度,跳出循環 break;}} document.getElementById("str").value=areaStr.substring(0,i);document.getElementById("now_len").innerHTML = temp;//當前輸入的字符長度document.getElementById("remainder_len").innerHTML = max-temp;//剩余字符長度 }</script><style type="text/css">table{font-size: 13px;font-family: 楷體;color:navy;}input{font-size: 13px;font-family: 楷體;color:navy;}font{font-size: 12px;font-family: 楷體;color:orangered;}.style1{width: 500px;height: 160px;}</style></head><body "limitTextarea()" ><fieldset class="style1"><legend>留言薄</legend><form action="" id="myform"><table align="center"><tr><td>留言內容: <font>最多可輸入20個字符。</font></td></tr> <tr><td><textarea name="s1" rows="5" cols="40" id="str" "limitTextarea()" "limitTextarea()"></textarea></td></tr><tr><td align="right"><font>當前字數:<span id="now_len" /></span> 剩余字數:<span id="remainder_len" ></span></font></td></tr> <tr><td ><input type="button" value="留 言" ></td></tr></table></form></fieldset></body>
</html>
總結
以上是生活随笔為你收集整理的限制Textarea文本域内容的长度的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。