Question

我有一个多行文本框，只能包含500个字符。现在我想向用户显示他们在文本框中输入时留下的字符数，就像我们使用twitter时一样。

请帮助

Answer 1

请参阅Ross Hawkins的ASP.NET Text Character Counter。

Answer 2

你必须写一些js代码。

这里是简单的snipptet：

<html><form name="form1"><input type="text" name="textArea" size="400" onkeyup="document.form1.count_display.value=document.form1.textArea.value.length;"><br/><input type="text" name="count_display"></form></body></html>

您可以根据需要更改计算以显示剩余字符或已输入的计数

Answer 3

让我们首先创建一个多行文本框。

<asp:TextBox ID="textTextBox" Text='<%# Bind("Text") %>' runat="server" 
CssClass="text     smsTextBox" TextMode="MultiLine" Height="100px" 
MaxLength="500" >
</asp:TextBox>

<p>
   <span id="remaining" class="remaining">500 characters remaining</span> 
   <span id="messages" class="messages">1 message(s)</span>
</p>

现在将其添加到javascript文件或将其添加到Javascript到正在呈现项目的页面。每次加载文档时，脚本都是运行

<script type="text/javascript">
$(document).ready(function () {

    if (typeof $('.smsTextBox').val() !== "undefined") {
        var $remaining = $('.remaining'),
        $messages = $remaining.next();

        var chars = $('.smsTextBox').val().length,
            messages = Math.ceil(chars / 500),
            remaining = messages * 500 - (chars % (messages * 500) || messages * 500);

        $remaining.text(remaining + ' characters remaining');
        $messages.text(messages + ' message(s)');
    }

});

$(document).ready(function () {
    var $remaining = $('.remaining'),
        $messages = $remaining.next();

    $('.smsTextBox').keyup(function () {
        var chars = this.value.length,
            messages = Math.ceil(chars / 500),
            remaining = messages * 500 - (chars % (messages * 500) || messages * 500);

        $remaining.text(remaining + ' characters remaining');
        $messages.text(messages + ' message(s)');
    });
});

</script>

快乐编码:-D

如何显示asp.net中多行文本框中剩余的字符数？

3 个答案: