zoukankan      html  css  js  c++  java
  • jQuery实现评论还剩多少个字

    <div class="area">
            <p>
                还可以输入<b class="num">140</b>字</p>
            <textarea class="chackTextarea"></textarea>
        </div>
     
     
    <script type="text/javascript">
        var txtobj = {
            divName: "area", //外层容器的class
            textareaName: "chackTextarea", //textarea的class
            numName: "num", //数字的class
            num: 140 //数字的最大数目
        }
        var textareaFn = function () {
            //定义变量
            var $onthis; //指向当前
            var $divname = txtobj.divName; //外层容器的class
            var $textareaName = txtobj.textareaName; //textarea的class
            var $numName = txtobj.numName; //数字的class
            var $num = txtobj.num; //数字的最大数目
            function isChinese(str) {  //判断是不是中文
                var reCh = /[u00-uff]/;
                return !reCh.test(str);
            }
            function numChange() {
                var strlen = 0; //初始定义长度为0
                var txtval = $.trim($onthis.val());
                for (var i = 0; i < txtval.length; i++) {
                    if (isChinese(txtval.charAt(i)) == true) {
                        strlen = strlen + 2; //中文为2个字符
                    } else {
                        strlen = strlen + 1; //英文一个字符
                    }
                }
                strlen = Math.ceil(strlen / 2); //中英文相加除2取整数
                if ($num - strlen < 0) {
                    $par.html("超出 <b style='color:red;font-weight:lighter' class=" + $numName + ">" + Math.abs($num - strlen) + "</b> 字"); //超出的样式
                }
                else {
                    $par.html("还可以输入 <b class=" + $numName + ">" + ($num - strlen) + "</b> 字"); //正常时候
                }
                $b.html($num - strlen);
            }
            $("." + $textareaName).live("focus", function () {
                $b = $(this).parents("." + $divname).find("." + $numName); //获取当前的数字
                $par = $b.parent();
                $onthis = $(this); //获取当前的textarea
                var setNum = setInterval(numChange, 500);
            });
        }
        textareaFn();
    </script>
  • 相关阅读:
    Mysql学习总结(19)——Mysql无法创建外键的原因
    Java Web学习总结(21)——http协议响应状态码大全以及常用状态码
    Java Web学习总结(21)——http协议响应状态码大全以及常用状态码
    Tomcat学习总结(5)——Tomcat容器管理安全的几种验证方式
    Android学习总结(1)——好的 Android 开发习惯
    phabricator
    linux-kernel 学习计划
    【华为云技术分享】Linux内核编程环境 (1)
    7 分钟全面了解位运算
    【华为云技术分享】鲲鹏弹性云服务器GCC交叉编译环境搭建指南
  • 原文地址:https://www.cnblogs.com/yxlblogs/p/3043536.html
Copyright © 2011-2022 走看看