zoukankan      html  css  js  c++  java
  • textarea限制字符数

    html代码:

     1 <div class="remark_edit J_Remark_Edit">
     2     <div class="tip-body">
     3         <h4>备注信息:</h4>
     4         <textarea cols="44">请输入备注信息</textarea>
     5     </div>
     6     <div class="tip-ctrl">
     7         <a href="#" class="btn-s-red J_Remark_Yes">确定</a>
     8         <a href="#" class="btn-s-gray J_Remark_Cancel">取消</a>
     9         <span>
    10         还能输入<strong class="maxNum" style="color: rgb(51, 51, 51);">137</strong>个字
    11         </span>
    12     </div>
    13 </div>

    js代码段:

    var Remark = {
            init:function(){
                this.editRemark = $('.J_Remark_Edit');
                this.bind();
            },
            bind:function(){
                var self = this;
                var $text = self.editRemark.one('textarea'),
                    bSend = false;
    
                //事件绑定, 判断字符输入
                $text.on('keyup',function(){
                    bSend = self.confine();
                });
                $text.on('focus',function(){
                    bSend = self.confine();
                });
                $text.on('change',function(){
                    bSend = self.confine();
                });
    
                self.editRemark.all('.J_Remark_Yes').on('click',function(e){
                    e.preventDefault();
                    if(bSend){
                        var msg = S.trim($text.val());
                        // send msg;
                    }else{
                        alert('内容不能超过140个字!');
                    }
                })
            },
            //输入字符限制
            confine : function(){
                var self = this;
                var $text = self.editRemark.one('textarea'),
                    $maxNum = self.editRemark.one('.maxNum'),
                    maxNum = 140,
                    bSend = false;
    
                var iLen = $text.val().length;
                $maxNum.html(maxNum - Math.floor(iLen));
            //最重要的就是这一句
    if(maxNum - Math.floor(iLen) >= 0){ $maxNum.css({"color":"#333"}); bSend = true; }else{ $maxNum.css({"color":"#d31022"}); bSend = false; } return bSend; } } Remark.init();
  • 相关阅读:
    第26月第13天 hibernate导包
    第26月第9天 getActionBar为空的解决办法
    第26月第8天 android studio 国内
    第26月第7天 mac如何matplotlib中文乱码问题
    第26月第6天 selenium
    第26月第3天 java gradle
    第26月第2天 vim javacomplete
    第25月第26天 dispatch_group_t dispatch_semaphore_t
    第25月25日 urlsession
    第25月第22日 django channels
  • 原文地址:https://www.cnblogs.com/summer_shao/p/3920485.html
Copyright © 2011-2022 走看看