活字计数器

Question

因此，当有人输入 "textarea" 并且在输入时显示到目前为止输入的字符数时，我试图做到这一点。下面的代码是我要为其设置计数器的字段。我想要故障排除工作中的字符计数器。我有什么想法可以着手去做吗？？

<tr>
                    <td width="70%">
                        <b>Troubleshooting</b><br />
                    </td>
                    <td width="30%">
                        <a href="javascript: validateHP()" onMouseover="buttonObject_HP.src='images/hp_1.png'" onMouseout ="buttonObject_HP.src='images/hp_0.png'">
                        &nbsp;<img name="buttonObject_HP" src="images/hp_0.png" border=0 alt="" width="75" height="20"/></a>        
                    </td>
                </tr>
            </table>
            <textarea class="normal" id="Reported" name="Reported" rows="12" cols="51" onchange="validateText();"></textarea>

Answer 1

您可以在您的代码中使用它。它使用 AngularJS.

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>

<div ng-app="">
 
<p>Input something in the input box:</p>
<p>Name : <input type="text" ng-model="name" placeholder="Enter name here"></p>
<h1>{{name.length}}</h1>

</div>

</body>
</html>

Answer 2

我做了以下得到我想要的东西。

将以下内容放在头部

<script src="http://code.jquery.com/jquery-1.5.js"></script>
     <script>
      function countChar(val) {
        var len = val.value.length;
        if (len >= 10000) {
          val.value = val.value.substring(50, 10000);
        } else {
          $('#charNum').text(2000 - len);
        }
      };
    </script>

然后将以下div放在我的疑难解答

下

<div id="charNum">Characters Left</div>

最后我将以下内容添加到我的文本区域

onkeyup="countChar(this)"

活字计数器

Live Character counter

html

counter

character