jquery || 检测已输入字数

最新推荐文章于 2023-03-31 13:12:10 发布

编程小飞侠

最新推荐文章于 2023-03-31 13:12:10 发布

阅读量397

点赞数

分类专栏： jquery

本文链接：https://blog.csdn.net/weixin_45703155/article/details/107360202

版权

jquery 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

代码：

<html>
<head>
        <script type="text/javascript" src="../jquery-3.4.1.min.js"></script>
</head>
<body>
        <div class="send_message">
                <div class="ui">
                        <div class="content_title">
                                随时随地发信息！！！
                        <div>
                        <div class="content_text">
                                <textarea class="content" name="content" onkeyup="check_number(this.value,'0')" rows="5" ></textarea>
                        </div>
                </div>


                <div class="show">
                        <span class="countTxt">还可输入<em class="count">160</em>字</sapn>
                        <button class="button" onclick="show()">发布</button>
                </div>

        </div>

        <script type="text/javascript">
        		/*检查输入字数*/
                function check_number(number,zero){
                        var len = 160 - number.length;
                        $(".count").text(len); /*显示字数倒数*/
                        if(len < 0){
                                window.alert("字数超出范围");
                                $(".count").css({	/*显示字数倒数颜色变化*/
                                        "color":"red"
                                });
                        }else{
                                $(".count").css({
                                        "color":"black"
                                });
                        }
                }
                
                /*按发布按钮时检测字数是否在范围内，不在提示错误*/
                function show(){
                        var content = $(".content").val();
                        var len = content.length;
                         if(len > 160){
                                window.alert("发送信息字体不能大于160个字");
                        }

                         if(len == 0){
                                window.alert("发送信息不能为空");
                        }

                }
                
        </script>
</body>
</html>

图：
在这里插入图片描述

编程小飞侠

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery || 检测已输入字数

代码：<html><head> <script type="text/javascript" src="../jquery-3.4.1.min.js"></script></head><body> <div class="send_message"> <div class="ui"> <d
复制链接

扫一扫