将计数器添加到HTML表单并计算积分

Ste*_*emp 1 html javascript jquery counter character

我有一个简单的HTML表单,允许用户输入一些文本,然后通过SMS网关作为SMS/TXT消息发送.用户将消息文本输入textarea:

<textarea rows="10" cols="40" id="smsbody" validate = "required:true" name="MessageBody"></textarea>
Run Code Online (Sandbox Code Playgroud)

他们可以输入尽可能少的文本,但是因为每个短信限制为160个字符,我想显示一个字符计数器,显示输入的字符数,然后还计算这将使用的短信数量.计算学分的公式基于输入的学分总数:如果一条信息超过160个字符,它将被分成多个信息部分.每个消息部分的长度限制为153个字符(标题为7个字节).因此,160个字符的消息将是1个信用,306个字符将是2个信用,459个字符将是3个信用等等.

理想情况下,我希望以这种格式出现:

0个字符,1个SMS消息200个字符,2个SMS消息

我已经在使用jQuery了,也很高兴使用基于jQuery的解决方案.

非常感谢,史蒂夫

use*_*716 5

像这样的东西?

试一试: http ://jsfiddle.net/kG8U2/2

我想我理解正确的是,对于1条消息,它可以是160个字符,但是对于多个消息,消息的数量是字符除以153.

HTML

<textarea rows="10" cols="40" id="smsbody" validate = "required:true" name="MessageBody"></textarea>
<div id='message'>
    <span id='char'>0</span> characters,
    <span id='msgs'>0</span> SMS message(s),
    <span id='remg'>160</span> remaining
</div>????
Run Code Online (Sandbox Code Playgroud)

jQuery的

var $chars = $('#char');
var $msgs = $('#msgs');
var $remg = $('#remg');

$('#smsbody').keyup(function(evt) {
    var len = this.value.length;
    $chars.text(len);
    if(len <= 160) {
        $msgs.text(1);
        $remg.text(160 - len);
    } else {
        var multi = Math.ceil((len/153)) ;
        $msgs.text(multi);
        $remg.text((multi * 153) - len);
    }
});?
Run Code Online (Sandbox Code Playgroud)

编辑:修正了一个由1个字符关闭的缺陷,并添加了剩余的计数器以获得乐趣.