上一篇
下一篇
08-03
17
TextArea输入时遇到的问题
作者:Java伴侣 日期:2008-03-17
今天找了半天的资料,为的是处理表单里的textArea的自动换行问题,调了很久,找了很多资料,但是如果一整行都是字母了话,它也不会自动换行,一直把textArea支开!!而且显示出来时也是一样,郁闷了一上午,后来发现,原来是FireFox的原因!!(不知道FireFox是啥鸡巴东西),我换成IE后,它就自动换行了,而且显示的效果也对了.
在此解决过程中得知几个方法控制TextArea输入字符长度的东东:
关于textarea控制字符数（中英文混杂）
我喜欢第三种方法:
第一种代码
<script>
function chklen()
{
len=0;
for(var begin = 0; begin < document.form.s1.value.length; begin++)
{
if(document.form.s1.value.charCodeAt(begin) < 127)
{
len+=1;
}
else
{
len+=2;
}
}
len=139-len;
if(len>=0)
{
tno.innerText = "剩余" + len + "个字符.";
tno.style.color = "000000";
}
else
{
tno.innerText = "内容超长" + -(len) + "个字符";
tno.style.color = "ff0000";
}
}
function checklen()
{
if(len<0)
{
alert("\内容超长" + -(len) + "个字符，请修改 !!")
return(false);
}
return(true);
}
document.onkeyup=chklen;
</script>
<body>
<form method=post action="123.jsp" name="form" onsubmit="return checklen()">
<textarea rows="7" name="s1" cols="37" maxlength=""></textarea><br>
<input type="submit">
</form>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" id="tno">剩余139个字符.</td>
</tr>
</table>
</body>
经典论坛小狗的代码供你参考，你把判断字符串长度的时候，把全角字符改成算两个即可
<textarea rows="4" cols="30" id=test
onkeypress=doKeypress()
onkeydown=doKeydown()
onbeforepaste=doBeforePaste()
onpaste=doPaste()
></textarea>
<script language=javascript>
maxLength = 10
element=document.all["test"]
function doKeypress()
{
if(!isNaN(maxLength))
{
maxLength = parseInt(maxLength)
var oTR = element.document.selection.createRange()
if(oTR.text.length >= 1)
event.returnValue = true
else if(element.value.length > maxLength-1)
event.returnValue = false
}
}
function doKeydown()
{
setTimeout(function()
{
maxLength = parseInt(maxLength)
if(!isNaN(maxLength))
{
if(element.value.length > maxLength-1)
{
var oTR = window.document.selection.createRange()
oTR.moveStart("character", -1*(element.value.length-maxLength))
oTR.text = ""
}
}
},1)
}
function doBeforePaste()
{
if(!isNaN(maxLength))
event.returnValue = false
}
function doPaste()
{
if(!isNaN(maxLength))
{
event.returnValue = false
maxLength = parseInt(maxLength)
var oTR = element.document.selection.createRange()
var iInsertLength = maxLength - element.value.length + oTR.text.length
var sData = window.clipboardData.getData("Text").substr(0, iInsertLength)
oTR.text = sData;
}
}
</script>
第三种
<script>
function checklen(obj){
var lenE = obj.value.length;
var lenC = 0;
var CJK = obj.value.match(/[\u4E00-\u9FA5\uF900-\uFA2D]/g);
if (CJK != null) lenC += CJK.length;
tno.innerText = obj.maxlength - lenC - lenE ;
if (tno.innerText < 0) {
var tmp = 0
var cut = obj.value.substring(0, obj.maxlength);
for (var i=0; i<cut.length; i++){
tmp += /[\u4E00-\u9FA5\uF900-\uFA2D]/.test(cut.charAt(i)) ? 2 : 1;
if (tmp > obj.maxlength) break;
}
obj.value = cut.substring(0, i);
}
}
</script>
<body onload="tno.innerText = s1.maxlength;">
<textarea name="s1" rows="5" cols="50" maxlength="1000" onpropertychange="checklen(this)"></textarea>
剩余<span id="tno"></span>个字符
onpropertychange属性在struts标签上没有这个属性,由此我又采取了以下的方法:
html]
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-language" content="zh-cn">
<meta name="author" content="forfor">
<title> Test Document </title>
<script type="text/javascript">
<!--
function check(obj){
var obj;
var max=10;
obj.value=obj.value.substring(0,max);
}
//-->
</script>
</head>
<body>
<textarea onkeyup="check(this);"></textarea>
</body>
</html>
[/html]
================================================
在 javascript中 直接判断输入的字数
因为表单提交时 应向用户显示 “输入的字数不超过200个字”
liuliu24 2005-5-7 07:31
HTML代码
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
在此解决过程中得知几个方法控制TextArea输入字符长度的东东:
关于textarea控制字符数（中英文混杂）
我喜欢第三种方法:
第一种代码
<script>
function chklen()
{
len=0;
for(var begin = 0; begin < document.form.s1.value.length; begin++)
{
if(document.form.s1.value.charCodeAt(begin) < 127)
{
len+=1;
}
else
{
len+=2;
}
}
len=139-len;
if(len>=0)
{
tno.innerText = "剩余" + len + "个字符.";
tno.style.color = "000000";
}
else
{
tno.innerText = "内容超长" + -(len) + "个字符";
tno.style.color = "ff0000";
}
}
function checklen()
{
if(len<0)
{
alert("\内容超长" + -(len) + "个字符，请修改 !!")
return(false);
}
return(true);
}
document.onkeyup=chklen;
</script>
<body>
<form method=post action="123.jsp" name="form" onsubmit="return checklen()">
<textarea rows="7" name="s1" cols="37" maxlength=""></textarea><br>
<input type="submit">
</form>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" id="tno">剩余139个字符.</td>
</tr>
</table>
</body>
经典论坛小狗的代码供你参考，你把判断字符串长度的时候，把全角字符改成算两个即可
<textarea rows="4" cols="30" id=test
onkeypress=doKeypress()
onkeydown=doKeydown()
onbeforepaste=doBeforePaste()
onpaste=doPaste()
></textarea>
<script language=javascript>
maxLength = 10
element=document.all["test"]
function doKeypress()
{
if(!isNaN(maxLength))
{
maxLength = parseInt(maxLength)
var oTR = element.document.selection.createRange()
if(oTR.text.length >= 1)
event.returnValue = true
else if(element.value.length > maxLength-1)
event.returnValue = false
}
}
function doKeydown()
{
setTimeout(function()
{
maxLength = parseInt(maxLength)
if(!isNaN(maxLength))
{
if(element.value.length > maxLength-1)
{
var oTR = window.document.selection.createRange()
oTR.moveStart("character", -1*(element.value.length-maxLength))
oTR.text = ""
}
}
},1)
}
function doBeforePaste()
{
if(!isNaN(maxLength))
event.returnValue = false
}
function doPaste()
{
if(!isNaN(maxLength))
{
event.returnValue = false
maxLength = parseInt(maxLength)
var oTR = element.document.selection.createRange()
var iInsertLength = maxLength - element.value.length + oTR.text.length
var sData = window.clipboardData.getData("Text").substr(0, iInsertLength)
oTR.text = sData;
}
}
</script>
第三种
<script>
function checklen(obj){
var lenE = obj.value.length;
var lenC = 0;
var CJK = obj.value.match(/[\u4E00-\u9FA5\uF900-\uFA2D]/g);
if (CJK != null) lenC += CJK.length;
tno.innerText = obj.maxlength - lenC - lenE ;
if (tno.innerText < 0) {
var tmp = 0
var cut = obj.value.substring(0, obj.maxlength);
for (var i=0; i<cut.length; i++){
tmp += /[\u4E00-\u9FA5\uF900-\uFA2D]/.test(cut.charAt(i)) ? 2 : 1;
if (tmp > obj.maxlength) break;
}
obj.value = cut.substring(0, i);
}
}
</script>
<body onload="tno.innerText = s1.maxlength;">
<textarea name="s1" rows="5" cols="50" maxlength="1000" onpropertychange="checklen(this)"></textarea>
剩余<span id="tno"></span>个字符
onpropertychange属性在struts标签上没有这个属性,由此我又采取了以下的方法:
html]
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-language" content="zh-cn">
<meta name="author" content="forfor">
<title> Test Document </title>
<script type="text/javascript">
<!--
function check(obj){
var obj;
var max=10;
obj.value=obj.value.substring(0,max);
}
//-->
</script>
</head>
<body>
<textarea onkeyup="check(this);"></textarea>
</body>
</html>
[/html]
================================================
在 javascript中 直接判断输入的字数
因为表单提交时 应向用户显示 “输入的字数不超过200个字”
liuliu24 2005-5-7 07:31
HTML代码[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
文章来自: 
引用通告: 
Tags: 
相关日志:
评论: 0 | 引用: 0 | 查看次数: 596
发表评论
