1. 程式人生 > >input,textarea限制字數,實時繫結

input,textarea限制字數,實時繫結

目前常用二種方法

1.在input 或 textarea中加屬性

maxlength="10"

2.js判斷

function limitImport(str,num){
    $(document).on('input propertychange',str,function(){
        var self = $(this);
        var content = self.val();
        if (content.length > num){
            self.val(content.substring(0,num));
        } 
        self.siblings('span').text(self.val().length+'/'+num);
    });
}

//用法示例
limitImport(‘.pushTe’,50);
沒有什麼特殊需要感覺還得第一個實用些

拓展: 實時繫結功能

$('.titleInput').bind('input propertychange',function(){
    // console.log($(this).val().length)
    if($(this).val().length<=20){
        document.getElementById('tiCont').innerHTML = $(this).val().length;
    }
});

-

$(document).bind('input propertychange','.class',function(){
    // console.log($(this).val().length)
    if($(this).val().length<=20){
        document.getElementById('tiCont').innerHTML = $(this).val().length;
    }
});

二種輸入標籤的實時繫結方式 。 需求:框後面有顯示字數