效果图

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml">
<HEAD>
<TITLE></TITLE>
<LINK href="css/User_Login.css" type=text/css rel=stylesheet>
<META http-equiv=Content-Type content="textml; charset=utf-8">
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
</HEAD>
<script type="text/javascript">

$().ready(function(){
var ty = document.getElementById("cty");
var motto=document.getElementById("motto");
var curLen=document.getElementById("curLen");
var maxLen=document.getElementById("maxLen");
var leftLen=document.getElementById("leftLen");
motto.onkeyup= function () {
maxLength = parseInt(maxLen.firstChild.nodeValue);
this.value = this.value.substr(0,maxLength);
var len = this.value.length;
curLen.firstChild.nodeValue = len;
leftLen.firstChild.nodeValue = maxLength-len;
};
//shade(ty);
});

</script>
<BODY>
<label>
<textarea name="motto" id="motto"></textarea>
<br/>
<em>
<span id="curLen">0</span>/<span id="maxLen">200</span>字， 还能输入<span id="leftLen">200</span>字！
</em>
</label>
</BODY>
</HTML>

html输入框输入显示剩余字数的更多相关文章

  1. android中实现在矩形框中输入文字，可以显示剩余字数的功能

    虽然这两个功能都比较简单,但是在实际app开发中真的很常见,特别是显示字数或剩余字数这个功能 如下图: 要实现上面的功能,需要做到三点: 1.实现矩形框布局 思路就是矩形框作为整个布局的一个backg ...

  2. 文本域textarea显示输入剩余字数

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. textarea标签提示录入剩余字数

    textarea标签提示录入剩余字数 <textarea onkeydown="checkMaxInput(this,300)" onkeyup="checkMax ...

  4. 如何实现textarea中获取动态剩余字数的实现

    工作中遇到一个案例,之前没有写过,今儿啃了半个下午硬是给写出来,灰常又成就感!当然对于js大牛来说这根本不算啥,但是对于我自己的js能力又向前迈出一小步. 案例介绍:我们常见到有的网站有textare ...

  5. input、textArea实时显示剩余可输入的字数

    <h2>实时显示剩余可输入的字数(字母,数字,中文都算一个字)</h2> <h>昵称:</h> <div> <input type=& ...

  6. JS实现动态提示文本框可输入剩余字数(类似发表微博数字提示)

    一.实现效果: 为了更直观的体现用户在文本框输入文本时能看到自己输入了多少字,项目中需要通过判断提示文本框剩余可输入字数. html & JS: <div> <textare ...

  7. JQ限制输入字数，并提示剩余字数

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 页面上有3个输入框：分别为max，min，num；三个按钮：分别为生成，排序，去重；在输入框输入三个数字后，先点击生成按钮，生成一个数组长度为num，值为max到min之间的随机整数点击排序，对当前数组进行排序，点击去重，对当前数组进行去重。 每次点击之后使结果显示在控制台

    <!DOCTYPE html> <html> <head> <!-- 页面上有3个输入框:分别为max,min,num:三个按钮:分别为生成,排序,去重: 在 ...

  9. JS 控制输入框输入表情emoji 显示在页面上

    问题描述: 最近做一个评论回复的功能遇到了用户输入框输入表情,存入数据库的时候转变成了问号??? 起初为了避免这个问题,做了一个过滤表情的控制 var inputText = $('#pinglun' ...

随机推荐

  1. eclipse 4.4安装aptana插件

    eclipse 4.4安装aptana插件: 1.地址: http://download.aptana.com/studio3/plugin/update/index.html.在线安装即可成功! 2 ...

  2. 聊聊ERP的VIP卡充值的那些事

    我们相信许多客户朋友,不管使用什么品牌的ERP系统,可能都有经历过各种各样的操作痛点,以及在某个阶段之前的功能无法满足现有的操作需求.今天我们就聊聊VIP卡充值操作遇到的一些问题以及相关解决方案,最大 ...

  3. springboot项目Invalid bound statement (not found): com.xxxx.dao.xxxDAO.xxx解决方法

    1.首先判断自己的Dao和mapper的对应关系,注意要一一对应的. 2.配置信息出现问题,注意配置信息填写: 3.记住要细心细心,细心,重要的事情说三遍.

  4. CentOs 7 安装mysql5.7.18（二进制版本）

    1.下载二进制版本安装包.搜狐开源镜像站:http://mirrors.sohu.com/mysql/MySQL-5.7/   , 找 mysql-5.7.18-linux-glibc2.5-x86_ ...

  5. Socket粘包问题的3种解决方案，最后一种最完美！

    在 Java 语言中,传统的 Socket 编程分为两种实现方式,这两种实现方式也对应着两种不同的传输层协议:TCP 协议和 UDP 协议,但作为互联网中最常用的传输层协议 TCP,在使用时却会导致粘 ...

  6. #2020征文-开发板# 用鸿蒙开发AI应用（三）软件篇

    目录: 前言 HarmonyOS 简介 DevEco Device Tool(windows下) 获取源码(切换到ubuntu) 烧录程序(切换回windows) 前言上一篇,我们在 Win10 上用 ...

  7. springboot源码解析-管中窥豹系列之aware（六）

    一.前言 Springboot源码解析是一件大工程,逐行逐句的去研究代码,会很枯燥,也不容易坚持下去. 我们不追求大而全,而是试着每次去研究一个小知识点,最终聚沙成塔,这就是我们的springboot ...

  8. Thread线程源码解析，Java线程的状态，线程之间的通信

    线程的基本概念 什么是线程 现代操作系统在运行一个程序的时候,会为其创建一个进程.例如,启动一个Java程序,操作系统就会创建一个Java进程.线代操作系统调度的最小单位是线程.也叫做轻量级进程.在一 ...

  9. 当Django设置DEBUG为False时，发现admin和html的静态资源文件加载失败的解决办法

    当Django设置DEBUG为False时,发现admin和html的静态资源文件加载失败,折腾一段时间终于找到解决办法: 1.先在setting文件增加BASE_DIR(项目的路径) BASE_DI ...

  10. 【ORA】ORA-4031错误分析和解决办法

    1. ORA-4031错误的原因,一般是大量的hard parse导致了shared pool中的free list中产生大量的内存小碎片,当一个需要很大内存来进行hard parse的sql语句到来 ...