<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>限制文件字数字</title>
</head>
<body>
<span class="span">备注信息</br><span id="stay" style="display: none"> 您还可以输入:<span id="txtCount"></span>个字符的描述信息</span></span>
         </br><input id="Remark_information" name="Remark_information" type="text">

         <script>
    var lim=new limit();
    lim.txtNote=document.getElementById("Remark_information");
    lim.txtLimit=document.getElementById("txtCount");
    lim.limitCount=80;
    lim.init();
    function limit(){
        var txtNote;//文本框
        var txtLimit;//提示字数的input
        var limitCount;//限制的字数
        var txtlength;//到达限制时，字符串的长度
        this.init=function(){
            txtNote=this.txtNote;
            txtLimit=this.txtLimit;
            limitCount=this.limitCount;
            txtNote.oninput=function(){wordsLimit()};txtNote.oninput=function(){wordsLimit()};
            txtLimit.innerText=limitCount;
        };
        function wordsLimit(){
            var noteCount=txtNote.value.length;
            var InPut=document.getElementById("Remark_information").value.length;
            if(InPut<1){
                document.getElementById("stay").style.display="none";
                return
            }
            if(InPut>=1){
                document.getElementById("stay").style.display="inline";
                document.getElementById("stay").style.color="green";
            }
            if(InPut>70){
                document.getElementById("stay").style.color="red";
            }
            if(noteCount>limitCount){
                txtNote.value=txtNote.value.substring(0,limitCount);
                txtLimit.innerText=0;
            }else{
                txtLimit.innerText=limitCount-noteCount;
            }
            txtlength=txtNote.value.length;//记录每次输入后的长度
        }
    }
</script>
</body>

来自：http://www.cnblogs.com/zhujiasheng/p/6113983.html

　　

JS 限制input框的输入字数，并提示可输入字数的更多相关文章

  1. js控制input框输入数字时，累计求和

    input框输入数字时,自动开始计算累加 <div class="form-group"> <label for="inputPassword3&quo ...

  2. js 动态控制 input 框 的只读属性

    需求: 当下拉框的值为06即Voucher时, 文本框才可输入, 其他情况均为置灰不可录入状态. 问题: 设置input框的只读属性写成了readonly="true" 尼玛,坑死 ...

  3. php页面输出时，js设置input框的选中值

    /* 设置表单的值 */ function setValue(name, value) { var first = name.substr(0, 1), input, i = 0, val; if ( ...

  4. js控制 input框中输入数字时，累计求和

    $('.cc input').bind('input propertychange', function(){ var total = 0; $("input").each(fun ...

  5. js控制input框只能输入数字和一位小数点和小数点后面两位小数

    <script language="JavaScript" type="text/javascript"> function clearNoNum( ...

  6. Js限制Input框只能输入数字

    <input type="text" onkeyup="value=value.replace(/[^\d]/g,'')" /> <input ...

  7. js复制input 框中的值

    function copy(){ var Url2=document.getElementById("copyValue"); Url2.select(); document.ex ...

  8. js对input框的可编辑属性设置

    添加disabled属性 $('#areaSelect').attr("disabled",true); $('#areaSelect').attr("disabled& ...

  9. 关于input框仿百度/google自动提示的方法

    引入jquery-autocomplete文件 链接:https://pan.baidu.com/s/1hW0XBYH8ZgJgMSY1Ce6Pig 密码:tv5b $(function() { $( ...

随机推荐

  1. MongoDB_基本操作

    数据库操作 增加数据库 use db1 #如果数据库不存在,则创建数据库,否则切换到指定数据库 查询数据库 show dbs #可以看到,我们刚创建的数据库db1并不在数据库的列表中,要显示它我们需要 ...

  2. python tips: for循环的小问题

    在python中,用for对列表进行遍历的时候,迭代器中维护的是列表的索引而不是列表的元素.也就是说,for循环是对索引进行迭代,如果在for循环过程中修改了列表,迭代出来的值是新列表的索引位置,如果 ...

  3. 初级模拟电路：1-2 PN结与二极管

    回到目录 1.   掺杂半导体 上面我们分析了本征半导体的导电情况,但由于本征半导体的导电能力很低,没什么太大用处.所以,一般我们会对本征半导体材料进行掺杂,即使只添加了千分之一的杂质,也足以改变半导 ...

  4. 网络教程(7）OSI模型的低层模型

    OSI Model——Open System Interconnection Model 开放系统互联模型

  5. 【推荐】你必须知道的EF知识和经验

    阅读目录   推荐MiniProfiler插件 数据准备 foreach循环的陷进 AutoMapper工具 联表查询统计 性能提升之AsNonUnicode 性能提升之AsNoTracking 多字 ...

  6. HDU 1061 EASY

    //回宿舍去了,明天做点难一点的题,今天做的都很水,感觉.没意思.#include <iostream> #include <cstdio> using namespace s ...

  7. java的classLoader原理理解和分析

    java的classLoader原理理解和分析 学习了:http://blog.csdn.net/tangkund3218/article/details/50088249 ClassNotFound ...

  8. mysql改动用户password

    登录root用户 用root用户登录控制台. use mysql use mysql,mysql是mysql数据库自己主动创建的一个数据库. 改动user表的数据 update user set pa ...

  9. iOS_6_ToolBar+xib+红楼梦

    终于效果图 BeyondViewController.h // // BeyondViewController.h // 6_ToolBar // // Created by beyond on 14 ...

  10. Mysql中You can't specify target table for update in FROM clause错误的意思是说，不能先select出同一表中的某些值，再update这个表(在同一语句中)。

    将select出的结果再通过中间表select一遍,这样就规避了错误.注意,这个问题只出现于mysql,mssql和oracle不会出现此问题. mysql中You can't specify tar ...