自定义文本框控件

6

我有一个具体的需求,需要控制多行文本框(ASP:TextBox)中输入的某些文本。

起初我认为可以只使用JavaScript来控制它,但似乎我无法完全满足我的需求。

现在我想知道是否需要从头开始编写控件(从未尝试过),或者是否可以继承自TextBox并能够获得所需的功能。

要求:

  1. 多行文本框
  2. 能够控制行和列
  3. 希望能够关闭出现在多行文本框上的已禁用的滚动条
  4. 仍然能够使用验证器
  5. 自动换行
  6. 最大长度
  7. 如果将列设置为26,行设置为4,则用户不应输入超过104个字符 (这是我尚未解决的部分)
  8. 即使未达到最大长度,用户也不能输入超过4行。

其中限制为4行的部分是我遇到的最大问题。

如果您输入:

a
b
c
d

我可以检查有多少个\n字符。但是如果您输入:

12345678901234567890123456
7890
c
d

这里它们已经换行了,因此少了一个\n字符,或者您输入:

This is a long piece of
text that has been entered
c
d

在这里,文本已经自动换行,因此您不能仅仅计算\n字符。


2
欢迎来到SO :) 您可以使用编辑器中的“引用”和“代码”按钮来格式化您的问题-它们就在编辑窗口上方。 此外,请看看这里以获取有关格式化问题的帮助。 - Town
你想要验证这个文本(如果文本不符合你的规则,就显示一个验证错误),还是你想要阻止用户输入无效的文本?但是,在任何情况下,如果你想在JavaScript中在客户端执行此操作,那么为什么需要实现一个新的服务器端控件以及它们之间的关系不是很清楚呢?展示“几乎工作”的JS代码也会有帮助。 - Tz_
是的,我将进行客户端验证。验证规则是输入不能超过4行,且每行字符数不能超过104个。 - Chris
验证是为了显示错误消息,防止输入还是仅仅截断文本? - Bob Vale
1个回答

1
  1. 将字符串按 '\n' 分割成数组。
  2. 计算每个数组成员的长度除以 26(向下取整,然后加 1)。
  3. 将这些数字相加(存储为总数)(但要减去 1,因为算法由于最后一个条目而计算了一行太多)。
  4. 取最后一个数组成员的长度模 26。(存储为 len1)
  5. 剩余要输入的字符数 = 104 - ((total*26) + len1)

如果您愿意,我可以为您提供一些 JavaScript 代码,但您想要显示错误消息、修剪文本还是防止输入(您对剪切+粘贴有什么处理方法?)

示例页面:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Untitled Page</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" language="javascript"
            type="text/javascript"></script>
    </head>
    <body>
        <script language="javascript" type="text/javascript">
            function validateTextArea(text) {
                var myText = text.val();
                var myArray = text.val().split("\n");
                var rowcount = myArray.length;
                for (i = 0; i < myArray.length; i++) {
                    rowcount += myArray[i].length / 26;
                }
                rowcount -= 1;
                var len1 = myArray[myArray.length - 1].length % 26;
                var charsleft = 104 - ((rowcount * 26) + len1);
                if (charsleft < 0) alert("TOO LONG!");
            }




        </script>
        <textarea rows="4" cols="26" id="txt"></textarea>
        <button onclick='validateTextArea($("#txt"))'>Do Validate</button>
    </body>
    </html>

具有Wrap="true"属性的ASP:TextBox在文本换行时不会插入硬'\n'。因此,上述方法将无法正常工作。 - Chris
是的,这就是为什么每一行都要除以26,所以如果换行了,它会增加一个额外的行计数。 - Bob Vale
是的,这就是为什么每行都要除以26,所以如果换行了,就会增加一行计数,所以以你的例子2为例 - 通过\n分成3个字符串(有2 * '\n' = 3个条目)。第一行30/26 = 1(向下取整),所以加1,条目2和3长度/26 = 0,所以总共= 1 + 3-1 = 3行。len1 = 1 mod 26 = 1。剩余要输入的字符数= 104-(26 * 3 + 1)= 104-79 = 25.... - Bob Vale

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接