TextArea控制有关问题,待,分不够可以再加
日期：2014-05-16 浏览次数：20316 次
TextArea控制问题,在线等待,分不够可以再加.
我想控制TextArea只能输入4行,并且每行可以输满,也可以不输满,并且如果在输满的情况下,如果用户将字符粘贴进去,那么TextArea会将超出四行的自动截断.
如果能回答这个问题分不够再加多少分都没关系
------解决方案--------------------
看看这样能满足你要求不
<html>
<head>
<noscript> <meta http-equiv= "refresh " content= "0; URL=http://www.google.com "/> </noscript>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 ">
<title> </title>
<script language=javascript>
function getTextRange()
{
var range = document.all( "txt ").createTextRange();
var rect = range.getClientRects();
if (rect.length < 5)
{
return ;
}
else
{
var bottom = rect[3].bottom;
range.moveEnd( "character ", -range.text.length);
while (range.offsetTop + range.boundingHeight <= bottom)
{
range.expand( "character ");
if (document.all( "txt ").value == range.text)
{
break;
}
}
document.all( "txt ").value = range.text.substr(0, range.text.length - 1);
return ;
}
}
</script>
</head>
<body>
<textarea id= "txt " onkeyup= "getTextRange() " onchange= "getTextRange() " rows=5>
<table border=1 cellpadding=0 cellspacing=0>
<tr> <td> 1111111111111111111111 </td> </tr>
<tr> <td> 1111111111111111111111 </td> </tr>
<tr> <td> 1111111111111111111111 </td> </tr>
<tr> <td> 1111111111111111111111 </td> </tr>
<tr> <td> 1111111111111111111111 </td> </tr>
<tr> <td> 1111111111111111111111 </td> </tr>
</table>
</textarea>
</body>
</html>
------解决方案--------------------
不好意思，弄了一下午才发现 TextArea 的软(soft)换行是根据单词边界(空格)自动实现的，
无法人为干预。
因此很难精确做出楼主要求的效果，俺现在也只实现了每行连续输入字符(不能输入空格)情况下的效果，粘贴也可以处理。TextArea 中最多输入 rows * cols 个字符。
代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN ">
<html>
<head>
<title> Fixed Rows TextArea </title>
<meta name= "Generator " content= "EditPlus ">
<meta name= "Author " content= " ">
<meta name= "Keywords " content= " ">
<meta name= "Description " content= " ">
</head>
<body>
<SPAN> rows= "4 " cols= "20 " </SPAN> <br />
<textarea id= "ttaSample " rows= "4 " cols= "20 "> 0123456789 </textarea> <br />
<input type= "button " id= "btnShow " value= "Show Result "> <br />
<span id= "spanOutput "> </span>
</body>
<script language= "JavaScript ">
<!--
var oBtn = document.getElementById( "btnShow ");
var oOutput = document.getElementById( "spanOutput ");
var oTxt = document.getElementById( "ttaSample ");
// \r\n
var LINE_BREAK = String.fromCharCode(13);
oBtn.o
我想控制TextArea只能输入4行,并且每行可以输满,也可以不输满,并且如果在输满的情况下,如果用户将字符粘贴进去,那么TextArea会将超出四行的自动截断.
如果能回答这个问题分不够再加多少分都没关系
------解决方案--------------------
看看这样能满足你要求不
<html>
<head>
<noscript> <meta http-equiv= "refresh " content= "0; URL=http://www.google.com "/> </noscript>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 ">
<title> </title>
<script language=javascript>
function getTextRange()
{
var range = document.all( "txt ").createTextRange();
var rect = range.getClientRects();
if (rect.length < 5)
{
return ;
}
else
{
var bottom = rect[3].bottom;
range.moveEnd( "character ", -range.text.length);
while (range.offsetTop + range.boundingHeight <= bottom)
{
range.expand( "character ");
if (document.all( "txt ").value == range.text)
{
break;
}
}
document.all( "txt ").value = range.text.substr(0, range.text.length - 1);
return ;
}
}
</script>
</head>
<body>
<textarea id= "txt " onkeyup= "getTextRange() " onchange= "getTextRange() " rows=5>
<table border=1 cellpadding=0 cellspacing=0>
<tr> <td> 1111111111111111111111 </td> </tr>
<tr> <td> 1111111111111111111111 </td> </tr>
<tr> <td> 1111111111111111111111 </td> </tr>
<tr> <td> 1111111111111111111111 </td> </tr>
<tr> <td> 1111111111111111111111 </td> </tr>
<tr> <td> 1111111111111111111111 </td> </tr>
</table>
</textarea>
</body>
</html>
------解决方案--------------------
不好意思，弄了一下午才发现 TextArea 的软(soft)换行是根据单词边界(空格)自动实现的，
无法人为干预。
因此很难精确做出楼主要求的效果，俺现在也只实现了每行连续输入字符(不能输入空格)情况下的效果，粘贴也可以处理。TextArea 中最多输入 rows * cols 个字符。
代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN ">
<html>
<head>
<title> Fixed Rows TextArea </title>
<meta name= "Generator " content= "EditPlus ">
<meta name= "Author " content= " ">
<meta name= "Keywords " content= " ">
<meta name= "Description " content= " ">
</head>
<body>
<SPAN> rows= "4 " cols= "20 " </SPAN> <br />
<textarea id= "ttaSample " rows= "4 " cols= "20 "> 0123456789 </textarea> <br />
<input type= "button " id= "btnShow " value= "Show Result "> <br />
<span id= "spanOutput "> </span>
</body>
<script language= "JavaScript ">
<!--
var oBtn = document.getElementById( "btnShow ");
var oOutput = document.getElementById( "spanOutput ");
var oTxt = document.getElementById( "ttaSample ");
// \r\n
var LINE_BREAK = String.fromCharCode(13);
oBtn.o
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
