如何为文本框多行创建字符计数器 [英] How to make character counter for textbox multiline

问题描述

在我正在进行的项目中，我处于一个多行文本框中，我将字符长度修改为400.我希望在输入任何键盘字符时缩短长度，并在删除任何字符时增加长度。柜台应以标签显示。任何人都可以帮忙吗？

解决方案

你好，是的，你可以用javascript做到这一点。请按照示例代码：

 <  表格    id   =  form1    runat   =  server >  
 <   script    类型  =  text / javascript  >  
函数CountChar（idTxtBox）{
 
 
 document.getElementById（'lblCountChar' ）.innerHTML = document.getElementById（idTxtBox）.value.length; 
} 
 <   / script  >  
 <   asp：TextBox     ID   =  txtDetails    宽度  =  200    runat   =  server    TextMode   =  MultiLine    onkeyup   =  CountChar（this.id）;    /  >  
 <   asp：Label  < span class =code-attribute>   ID   =  lblCountChar   文本  =      runat  < span class =code-keyword> =  server    /  >  
 
 <   / form  >  

你可以 为这个 TextChanged 事件添加一个处理程序：

  private   void  myTextBox_TextChanged（ object  sender，EventArgs e）
 {
  int  retain =  400   -  myTextBox.Text.Length; 
 myLabel.Text = remain.ToString（）; 
} 

您好，



使用以下内容，

 <   asp：Content     ID   =  HeaderContent    runat   =  server    ContentPlaceHolderID   =  HeadContent >  
 <   script     src   =  Scripts / jquery-1.4.1-vsdoc .js    type   =  text / javascript >  <   / script  >  
 <   script     src   =  Scripts / jquery-1.4.1.js   类型  =  text / javascript >  <   / script  < span class =code-keyword>>  
 <   script     src   =  Scripts / jquery-1.4.1.min.js   类型  =  text / javascript >  <   / script   >  
 <   script     language   =  javascript    type   =  text / javascript >  
 function strin gCounter（textBox，countlabel，maxlength）{
 countlabel.value = maxlength  -  textBox.value.length; 
} 
 <   / script  >  
 <   / asp：Content  >  
 <   asp：Content     ID   =  BodyContent    runat   =   server    ContentPlaceHolderID  < span class =code-keyword> = 主要内容 >  
 
 <   asp：TextBox     ID   =  TextBox1    runat   =  server   高度  =  100   < span class =code-attribute>宽度  =  550    Wrap   =  true  
   
                         TextMode   =  MultiLine    MaxLength   =  500    onkeyup   =  stringCounter（MainContent_TextBox1，MainContent_label1,500）;  
   
                         onkeydown   =  stringCounter（MainContent_TextBox1，MainContent_label1,500）;    /  >  
& nbsp ;&安培; NBSP; 
 <   asp：TextBox     ID   =  label1    runat   = 服务器    ReadOnly   =   true    BorderStyle  < span class =code-keyword> = 无 >  <   / asp：TextBox  >  
 <   / asp：Content  >  

In my ongoing project I am held up at a multiline textbox where I have fixed the character length to 400. I want the length to reduce when any keyboard character entered and the length increases when any character deleted. The counter shall be displayed in a label. Can any one help?

解决方案

Hello, yes you can do this with javascript. please follow the sample code:

<form id="form1" runat="server">
    <script type="text/javascript">
        function CountChar(idTxtBox) {


            document.getElementById('lblCountChar').innerHTML = document.getElementById(idTxtBox).value.length;
        }
    </script>
    <asp:TextBox ID="txtDetails" Width="200" runat="server" TextMode="MultiLine" onkeyup="CountChar(this.id);" />
    <asp:Label ID="lblCountChar" Text="" runat="server" />

    </form>

You may add a handler for the TextChanged event, this way:

private void myTextBox_TextChanged(object sender, EventArgs e)
{
  int remain = 400 - myTextBox.Text.Length;
  myLabel.Text = remain.ToString();
}

Hi,

Use the following,

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
 <script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script language="javascript" type="text/javascript">
        function stringCounter(textBox, countlabel, maxlength) {
            countlabel.value = maxlength - textBox.value.length;
        }
    </script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">

   <asp:TextBox ID="TextBox1" runat="server" Height="100" Width="550" Wrap="true"

           TextMode="MultiLine" MaxLength="500" onkeyup="stringCounter(MainContent_TextBox1, MainContent_label1, 500);"

           onkeydown="stringCounter(MainContent_TextBox1, MainContent_label1, 500);" />
&nbsp;&nbsp;
   <asp:TextBox ID="label1" runat="server" ReadOnly="true" BorderStyle="None"></asp:TextBox>
</asp:Content>

这篇关于如何为文本框多行创建字符计数器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！