Question

我有一个textarea，下面有一个计数输入字符。还设置了最大输入限制。我还添加了几个跨度，在点击它们时也会将值插入到该textarea中。

<span id="tag1" class="tags"></span>
<span id="tag2" class="tags"></span>
<br>
<textarea id="myTextArea"></textarea> 
<br>
Counter: <font id="charCount"></font>

跨度中的内容包含数值，如（10）。当值插入textarea时，我需要计数器增加该值，而不是插入中的char计数。

目前有些有效，有些则无效。需要帮助把它放在一起。我把我的代码放在这里：http://jsfiddle.net/8R9DH/11/

编辑：

预期行为：

输入文本区域可以通过直接输入或点击跨度或两者的组合来完成
计数器将所有字符计数到最大值，并在达到限制后停止输入
计数器计算手动输入的每个字符和空格，但当插入是用户时，计数器会增加包含中包含的数值。例如。 ＆lt; text include（5）＆gt; == 5或 ＆lt; text include（10）＆gt; == 10 例如，以下输入应计为13个字符：
```
<textarea id="myTextArea">abc <text insert (5)> 123</textarea>
```

Answer 1

您的javascript逻辑中存在错误。调用跨度的onClick事件的函数还应包括正确更新计数的逻辑。以下是它的样本。

$(".tags").click(function() {
    var insertTag = $(this).text(),
        tagLength = insertTag.replace(/[^0-9]/g, "");
    var n = parseInt(input.val().replace(/{|}/g, '').length) + parseInt(tagLength);
    if ( n <= limit ) {
        input.append(" &lt;" + insertTag + "&gt;");
        count.text( n );
    }
});

但是应该进一步改进此代码，以正确计算文本框中的现有值。因此

input.val().replace(/{|}/g, '').length

应该改进

以分别过滤掉现有的标签，并用文本框中的其他字符计算计数。

需要帮助来调试jQuery char计数器逻辑

1 个答案: