【js笔记】js动态显示文本框可输入字数

当我们设置留言或者文章标题的时候经常会设置文本框可输入的字数，如果加上动态的显示提醒就更加人性化了！

不多说，上码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试文本框还剩余字数显示</title>
    <script type="text/javascript">
        function setShowLength(obj, maxlength, id)
        {
            var rem = maxlength - obj.value.length;
            var wid = id;
            if (rem < 0){
                rem = 0;
            }
            document.getElementById('cost_tpl_title_length').innerHTML = "还可以输入" + rem + "字数";
        }
    </script>
</head>
<body>
    <input name="title" type="text" size="50" value="" maxlength="15" onkeyup="javascript:setShowLength(this, 15, 'cost_tpl_title_length');"><span class="red" id="cost_tpl_title_length">还可以输入15字数</span>
</body>
</html>

 

posted @ 2016-02-26 11:57  海岛心  阅读(707)  评论(0)  编辑  收藏  举报