• 限制表单Input的长度,当达到一定长度时不能再输入


    html代码:

    <div class="news-edit">

    <label for="" class="edit-titlelabel">标题</label>

    <span class="news-inputbox"><input type="text" placeholder="请输入文本" id="title" onkeydown="check_input('title','remLen',36);" onkeyup="check_input('title','remLen',36);"/></span>

    <span class="wordnum-limit"><span id="remLen">0/18</span></span>

    </div>

    js代码:

    //该函数用于输出框,当输入值大于指定的最大值的时候,返回当长度等于Max的值
    function getByteVal(val, max) {
    var returnValue = '';
    var byteValLen = 0;
    for (var i = 0; i < val.length; i++) {
    if (val[i].match(/[^x00-xff]/ig) != null)
    byteValLen += 2;
    else
    byteValLen += 1;
    if (byteValLen > max)
    break;
    returnValue += val[i];

    }
    return returnValue;
    }
    //该函数用户计算输入框中 的输入值的长度,其中中文为2,英文为1,数字为1
    function countCharacters(str){
    var totalCount = 0;
    //alert("ss");
    for(var i=0; i<str.length; i++){
    var c = str.charCodeAt(i);
    if ((c >= 0x0001 && c <= 0x007e) || (0xff60<=c && c<=0xff9f)){
    totalCount++;
    }else{
    totalCount+=2;
    }
    }
    return totalCount;
    }
    //该函数用于检验输入值,在该函数中调用了以上两个函数
    function check_input(id,remId,max){

    var send_wb_count=max;

    //var txt = id.value;
    var txt=document.getElementById(id).value;
    //alert(txt);

    var wb_count = countCharacters(txt);

    //var info=id.next();
    if(wb_count > send_wb_count){
    //$('#send_weibo').val(txt.substring(0,130));
    //id.val(getByteVal(txt,max));
    $("#"+id).val(getByteVal(txt,max));
    //alert(id.val(getByteVal(txt,max)));
    $("#"+remId).html("长度超过"+send_wb_count/2) ;
    }else{
    $("#"+remId).html(Math.floor((send_wb_count-wb_count)/2)+"/"+max/2) ;
    }
    }

  • 相关阅读:
    黑马程序员_字符串常用处理方法
    动软代码生成器,主子表增加的时候子表的parentID无法插入问题解决方案
    大数据量高并发的数据库优化详解
    C# Socket网络编程精华篇 (转)
    html+javascript+soap获取webservice免费天气预报信息
    js中字符串怎么转化为日期
    attachEvent方法的作用
    C#中[WebMethod]的用法,aspx、ashx、asmx
    C#操作XML方法详解
    C#操作XML的通用方法总结
  • 原文地址:https://www.cnblogs.com/snowbaby-kang/p/3786437.html
Copyright © 2020-2023  润新知