asp.net - 为多行文本框指定最大长度

Question

我正在尝试使用 asp：

<asp:TextBox ID="txtInput" runat="server" TextMode="MultiLine"></asp:TextBox>

我想要一种指定maxlength属性的方法，但显然multiline textbox. 我一直在尝试为该onkeypress事件使用一些 JavaScript：

onkeypress="return textboxMultilineMaxNumber(this,maxlength)"

function textboxMultilineMaxNumber(txt, maxLen) {
    try {
        if (txt.value.length > (maxLen - 1)) return false;
    } catch (e) { }
    return true;
}

虽然工作正常，但这个 JavaScript 函数的问题是，在写入字符后，它不允许您删除和替换其中的任何一个，这种行为是不希望的。

你知道我可以在上面的代码中改变什么来避免这种情况或任何其他方法来绕过它吗？

score 75 · Accepted Answer

请改用正则表达式验证器。这将在使用 JavaScript 的客户端上运行，但在禁用 JavaScript 时也适用（因为长度检查也将在服务器上执行）。

以下示例检查输入的值是否在 0 到 100 个字符之间：

<asp:RegularExpressionValidator runat="server" ID="valInput"
    ControlToValidate="txtInput"
    ValidationExpression="^[\s\S]{0,100}$"
    ErrorMessage="Please enter a maximum of 100 characters"
    Display="Dynamic">*</asp:RegularExpressionValidator>

当然，您可以使用更复杂的正则表达式来更好地满足您的目的。

score 44 · Accepted Answer

试试这个javascript：

function checkTextAreaMaxLength(textBox,e, length)
{

        var mLen = textBox["MaxLength"];
        if(null==mLen)
            mLen=length;

        var maxLength = parseInt(mLen);
        if(!checkSpecialKeys(e))
        {
         if(textBox.value.length > maxLength-1)
         {
            if(window.event)//IE
              e.returnValue = false;
            else//Firefox
                e.preventDefault();
         }
    }   
}
function checkSpecialKeys(e)
{
    if(e.keyCode !=8 && e.keyCode!=46 && e.keyCode!=37 && e.keyCode!=38 && e.keyCode!=39 && e.keyCode!=40)
        return false;
    else
        return true;
}

在控件上像这样调用它：

<asp:TextBox Rows="5" Columns="80" ID="txtCommentsForSearch" MaxLength='1999' onkeyDown="checkTextAreaMaxLength(this,event,'1999');"  TextMode="multiLine" runat="server"> </asp:TextBox>

您也可以只使用 checkSpecialKeys 函数来验证您的 javascript 实现中的输入。

score 30 · Accepted Answer

把事情简单化。大多数现代浏览器都支持文本区域（包括 IE）的 maxlength 属性，因此只需在代码隐藏中添加该属性。没有 JS，没有 Jquery，没有继承，自定义代码，没有大惊小怪，没有混乱。

VB.Net：

fld_description.attributes("maxlength") = 255

C＃

fld_description.Attributes["maxlength"] = 255

score 22 · Accepted Answer

滚动你自己的：

function Count(text) 
{
    //asp.net textarea maxlength doesnt work; do it by hand
    var maxlength = 2000; //set your value here (or add a parm and pass it in)
    var object = document.getElementById(text.id)  //get your object
    if (object.value.length > maxlength) 
    {
        object.focus(); //set focus to prevent jumping
        object.value = text.value.substring(0, maxlength); //truncate the value
        object.scrollTop = object.scrollHeight; //scroll to the end to prevent jumping
        return false;
    }
    return true;
}

像这样调用：

<asp:TextBox ID="foo" runat="server" Rows="3" TextMode="MultiLine" onKeyUp="javascript:Count(this);" onChange="javascript:Count(this);" ></asp:TextBox>

score 6 · Accepted Answer

HTML5 发生了变化：

ASPX：

<asp:TextBox ID="txtBox" runat="server" maxlength="2000" TextMode="MultiLine"></asp:TextBox>

C＃：

if (!IsPostBack)
{
    txtBox.Attributes.Add("maxlength", txtBox.MaxLength.ToString());
}

呈现的 HTML：

<textarea name="ctl00$DemoContentPlaceHolder$txtBox" id="txtBox" maxlength="2000"></textarea>

元数据Attributes：

摘要：获取与控件上的属性不对应的任意属性（仅用于呈现）的集合。

返回： ASystem.Web.UI.AttributeCollection名称和值对。

score 5 · Accepted Answer

使用自定义属性 maxsize="100"

<asp:TextBox ID="txtAddress" runat="server"  maxsize="100"
      Columns="17" Rows="4" TextMode="MultiLine"></asp:TextBox>
   <script>
       $("textarea[maxsize]").each(function () {
         $(this).attr('maxlength', $(this).attr('maxsize'));
         $(this).removeAttr('maxsize'); 
       });
   </script>

这将呈现这样

<textarea name="ctl00$BodyContentPlac
eHolder$txtAddress" rows="4" cols="17" id="txtAddress" maxlength="100"></textarea>

score 4 · Accepted Answer

对于那些在没有 javascript 的情况下支持 textareas (HTML5) 上的 maxlength 的浏览器（Firefox、Chrome、Safari）解决此问题的另一种方法是派生 System.Web.UI.WebControls.TextBox 类的子类并覆盖 Render 方法。然后在被覆盖的方法中，在正常渲染之前添加 maxlength 属性。

protected override void Render(HtmlTextWriter writer)
{
    if (this.TextMode == TextBoxMode.MultiLine
        && this.MaxLength > 0)
    {
        writer.AddAttribute(HtmlTextWriterAttribute.Maxlength, this.MaxLength.ToString());
    }

    base.Render(writer);
}

score 3 · Accepted Answer

3

$('#txtInput').attr('maxLength', 100);

于 2011-07-07T17:47:02.387 回答

score 3 · Accepted Answer

使用 HTML textarearunat="server"在服务器端访问它。这个解决方案比使用 javascript 或 regex 更轻松。

<textarea runat="server" id="txt1" maxlength="100" />

注意：要Text在服务器端访问属性，您应该使用txt1.Value而不是txt1.Text

score 2 · Accepted Answer

我尝试了不同的方法，但每个方法都有一些弱点（即剪切和粘贴或浏览器兼容性）。这是我现在使用的解决方案：

function multilineTextBoxKeyUp(textBox, e, maxLength) {
    if (!checkSpecialKeys(e)) {
        var length = parseInt(maxLength);
        if (textBox.value.length > length) {
            textBox.value = textBox.value.substring(0, maxLength);
        }
    }
}

function multilineTextBoxKeyDown(textBox, e, maxLength) {
    var selectedText = document.selection.createRange().text;
    if (!checkSpecialKeys(e) && !e.ctrlKey && selectedText.length == 0) {
        var length = parseInt(maxLength);
        if (textBox.value.length > length - 1) {
            if (e.preventDefault) {
                e.preventDefault();
            }
            else {
                e.returnValue = false;
            }
        }
    }
}

function checkSpecialKeys(e) {
    if (e.keyCode != 8 && e.keyCode != 9 && e.keyCode != 33 && e.keyCode != 34 && e.keyCode != 35 && e.keyCode != 36 && e.keyCode != 37 && e.keyCode != 38 && e.keyCode != 39 && e.keyCode != 40) {
        return false;
    } else {
        return true;
    }
}

在这种情况下，我在 key up 时调用 multilineTextBoxKeyUp ，在 key down 时调用 multilineTextBoxKeyDown ：

myTextBox.Attributes.Add("onkeyDown", "multilineTextBoxKeyDown(this, event, '" + maxLength + "');");
myTextBox.Attributes.Add("onkeyUp", "multilineTextBoxKeyUp(this, event, '" + maxLength + "');");

score 2 · Accepted Answer

以下是我们的做法（将所有代码保存在一个地方）：

<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine"/>
<% TextBox1.Attributes["maxlength"] = "1000"; %>

以防万一有人在 2018 年仍在使用网络表单。

score 1 · Accepted Answer

看看这个。解决它的唯一方法是您尝试使用javascript。

编辑： 尝试将事件更改为 keypressup。

score 0 · Accepted Answer

JavaScript/Jquery 中的以下示例将执行此操作 -

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
<script type="text/javascript">
     function count(text, event) {

         var keyCode = event.keyCode;

         //THIS IS FOR CONTROL KEY
         var ctrlDown = event.ctrlKey;

         var maxlength = $("#<%=txtMEDaiSSOWebAddress1.ClientID%>").val().length;

         if (maxlength < 200) {
             event.returnValue = true;
         }
         else {

             if ((keyCode == 8) || (keyCode == 9) || (keyCode == 46) || (keyCode == 33) || (keyCode == 27) || (keyCode == 145) || (keyCode == 19) || (keyCode == 34) || (keyCode == 37) || (keyCode == 39) || (keyCode == 16) || (keyCode == 18) ||
                 (keyCode == 38) || (keyCode == 40) || (keyCode == 35) || (keyCode == 36) || (ctrlDown && keyCode == 88) || (ctrlDown && keyCode == 65) || (ctrlDown && keyCode == 67) || (ctrlDown && keyCode == 86)) 

                  {
                 event.returnValue = true;
                  }

             else {

                 event.returnValue = false;
             }
         }

     }

     function substr(text)
      {
          var txtWebAdd = $("#<%=txtMEDaiSSOWebAddress1.ClientID%>").val();
          var substrWebAdd;
          if (txtWebAdd.length > 200) 
          {                 
              substrWebAdd = txtWebAdd.substring(0, 200);                                  
              $("#<%=txtMEDaiSSOWebAddress1.ClientID%>").val('');
              $("#<%=txtMEDaiSSOWebAddress1.ClientID%>").val(substrWebAdd); 

          }
     }

score 0 · Accepted Answer

这个片段在我的情况下有效。我正在寻找解决方案并想写这个，以便它可以帮助任何未来的读者。

ASP

<asp:TextBox ID="tbName" runat="server" MaxLength="250" TextMode="MultiLine" onkeyUp="return CheckMaxCount(this,event,250);"></asp:TextBox>

Java 脚本

function CheckMaxCount(txtBox,e, maxLength)
{
    if(txtBox)
    {  
        if(txtBox.value.length > maxLength)
        {
            txtBox.value = txtBox.value.substring(0, maxLength);
        }
        if(!checkSpecialKeys(e))
        {
            return ( txtBox.value.length <= maxLength)
        }
    }
}

function checkSpecialKeys(e)
{
    if(e.keyCode !=8 && e.keyCode!=46 && e.keyCode!=37 && e.keyCode!=38 && e.keyCode!=39 && e.keyCode!=40)
        return false;
    else
        return true;
}

在复制/粘贴的情况下，@Raúl Roa Answer 确实对我有用。虽然这样做。

score 0 · Accepted Answer

$("textarea[maxlength]").on("keydown paste", function (evt) {
            if ($(this).val().length > $(this).prop("maxlength")) {
                if (evt.type == "paste") {
                    $(this).val($(this).val().substr(0, $(this).prop("maxlength")));
                } else {
                    if ([8, 37, 38, 39, 40, 46].indexOf(evt.keyCode) == -1) {
                        evt.returnValue = false;
                        evt.preventDefault();
                    }
                }
            }
        });

score 0 · Accepted Answer

您可以在 pageLoad Javascript 事件中指定多行文本框的最大长度

function pageLoad(){
                     $("[id$='txtInput']").attr("maxlength","10");
                    }

我已在 pageLoad() Javascript 函数中将txtInput多行文本框的最大长度属性设置为 10 个字符

score 0 · Accepted Answer

这与@KeithK 的答案相同，但有更多细节。首先，创建一个基于 TextBox 的新控件。

using System.Web.UI;
using System.Web.UI.WebControls;

namespace MyProject
{
    public class LimitedMultiLineTextBox : System.Web.UI.WebControls.TextBox
    {
        protected override void Render(HtmlTextWriter writer)
        {
            this.TextMode = TextBoxMode.MultiLine;

            if (this.MaxLength > 0)
            {
                writer.AddAttribute(HtmlTextWriterAttribute.Maxlength, this.MaxLength.ToString());
            }

            base.Render(writer);
        }
    }
}

请注意，上面的代码总是将文本模式设置为多行。

为了使用它，您需要在 aspx 页面上注册它。这是必需的，因为您需要使用 TagPrefix 引用它，否则编译会抱怨自定义通用控件。

<%@ Register Assembly="MyProject" Namespace="MyProject" TagPrefix="mp" %>

<mp:LimitedMultiLineTextBox runat="server" Rows="3" ...

score 0 · Accepted Answer

几乎所有现代浏览器现在都支持对 textarea 元素使用 maxlength 属性。（https://caniuse.com/#feat=maxlength）

要在多行 TextBox 中包含 maxlength 属性，您可以简单地修改后面代码中的 Attributes 集合，如下所示：

txtTextBox.Attributes["maxlength"] = "100";

如果您不想使用后面的代码来指定它，您可以创建一个从 TextBox 派生的自定义控件：

public class Textarea : TextBox
{
    public override TextBoxMode TextMode
    {
        get { return TextBoxMode.MultiLine; }
        set { }
    }

    protected override void OnPreRender(EventArgs e)
    {
        if (TextMode == TextBoxMode.MultiLine && MaxLength != 0)
        {
            Attributes["maxlength"] = MaxLength.ToString();
        }

        base.OnPreRender(e);
    }
}

score 0 · Accepted Answer

MaxLength 现在从 .NET 4.7.2 开始支持，因此只要您将项目升级到 .NET 4.7.2 或更高版本，它就会自动运行。

您可以在此处的发行说明中看到这一点- 特别是：

使 ASP.NET 开发人员能够为 Multiline asp:TextBox 指定 MaxLength 属性。[449020，System.Web.dll，错误]

asp.net - 为多行文本框指定最大长度

19 回答 19

Related

Reference