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

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>显示输入剩余字数</title>

<script>

    var maxstrlen=160;

    function Q(s){return document.getElementById(s);}

    function checkWord(c){

        len=maxstrlen;

        var str = c.value;

        myLen=getStrleng(str);

        var wck=Q("wordCheck");

        if(myLen>len*2){

            c.value=str.substring(0,i+1);

        }

        else{

            wck.innerHTML = Math.floor((len*2-myLen)/2);

           }

    }

    function getStrleng(str){

        myLen =0;

        i=0;

        for(;(i<str.length)&&(myLen<=maxstrlen*2);i++){

        if(str.charCodeAt(i)>0&&str.charCodeAt(i)<128)

        myLen++;

        else

        myLen+=2;

    }

    return myLen;

}

</script>

</head>

<body>

<div style="font-size:16px">

控制输入框字符输入，计算输入字符总数,显示剩余字数;<br>

一个英文字符算一个字符，一个中文字符算两个字符计算。

</div>

<div>

<textarea onKeyUp="javascript:checkWord(this);" onMouseDown="javascript:checkWord(this);" name="content" style="overflow-y:scroll"></textarea>

</div>

<DIV>

还可以输入<span style="font-family: Georgia; font-size: 26px;" id="wordCheck">160</span>个字符 </div>

</body>

</html>

文本域textarea显示输入剩余字数的更多相关文章

  1. css 文本域textarea显示成label标签

    <html> <head>     <title>textarea显示为label</title> <style type="text/ ...

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

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

  3. 解决：HTML中多文本域(textarea)回车后数据存入数据库，EL表达式取出异常。

    问题描述: 当多文本域(textarea)回车后数据存入数据库. EL表达式取出异常,值换行倒置页面报错. 问题解决: 存值脚本代码,提交前转换\n为<br/>. <script t ...

  4. 文本域textarea

      文本域 CreateTime--2017年5月23日15:12:08Author:Marydon 二.文本域 (一)语法 <textarea></textarea> (二) ...

  5. palacehoder的自定义样式【输入框input /文本域textarea】

    7.palacehoder的自定义样式[输入框input /文本域textarea] 因为每个浏览器的CSS选择器都有所差异,所以需要针对每个浏览器做单独的设定(可以在冒号前面写input和texta ...

  6. Bootstrap 表单控件一（单行输入框input，下拉选择框select ，文本域textarea）

    单行输入框,常见的文本输入框,也就是input的type属性值为text.在Bootstrap中使用input时也必须添加type类型,如果没有指定type类型,将无法得到正确的样式,因为Bootst ...

  7. html文本域textarea高度自增、自动换行

    文本域自动换行.高度自增,采用以下方式: html: <textarea rows="1" class="answerTextArea" maxlengt ...

  8. Bootstrap系列 -- 16. 文本域textarea

    文本域和原始使用方法一样,设置rows可定义其高度,设置cols可以设置其宽度.但如果textarea元素中添加了类名“form-control”类名,则无需设置cols属性.因为Bootstrap框 ...

  9. 文本域textarea的一个小细节

    文本域代码在编写时,最好写在一行上,就像: 如果没写在一行上,如: 那么就会在后续生成的页面上输入的时候就会产生一段空白无法删除: 这是写文本框的时候的一个小细节

随机推荐

  1. 前端自动化学习笔记（一）——Yeoman,bower,Grunt的安装

    最近看视频学习了前端自动化的一些知识,确实让我大开眼界.感觉前端越来越神器了.同时跟着视频自己也尝试运用了一些工具去构建前端项目,但是中间遇见了很多坑,磕磕绊绊的才实现了一点功能,所以打算记录一下学习 ...

  2. Arcgis Runtime sdk for android 授权

    要下载和安装 ArcGISRuntime SDK for Android,您需要注册开发者账户,进而便拥有了访问所有功能的权限,从而实现开发和测试目的.但是,这种情况下,应用程序中的所有地图都具有水印 ...

  3. C#中的多线程-入门

    概述与概念C#支持通过多线程并行地执行代码,一个线程有它独立的执行路径,能够与其它的线程同时地运行.一个C#程序开始于一个单线程,这个单线程是被CLR和操作系统(也称为“主线程”)自动创建的,并具有多 ...

  4. Subsets,Subsets II

    一.Subsets Given a set of distinct integers, nums, return all possible subsets. Note: Elements in a s ...

  5. Windows下的窗口程序

    再进一步. . .model flat,stdcall option casemap:none include Windows.inc include user32.inc includelib us ...

  6. EC读书笔记系列之19：条款49、50、51、52

    条款49 了解new-handler的行为 记住: ★set_new_handler允许客户指定一个函数,在内存分配无法获得满足时被调用 ★Nothrow new是一个颇为局限的工具,∵其只适用于内存 ...

  7. Inno Setup打包的程序提升为管理员权限

    Inno Setup打包的程序在Win7 64位系统上安装,安装步骤最后一步若选中运行程序,会跳出一个错误提示框. 这是因为64位win7系统运行程序时需要管理员权限,而打包的文件并没有这个权限就试图 ...

  8. 动手编写插件-javascript分页插件

    原来公司用的报表分页插件是C#编写的服务器插件,需要前后台交互,而且不支持ajax. 经过一段时间折腾,我编写了一个轻便的jquery分页插件,支持ajax.下面是插件代码 /* 插件名称:报表分页 ...

  9. CSS 3 属性学习 —— 2. RGBA

    RGBA 是 CSS3 中用来控制颜色的单位,分别是 Red Green Blue 三原色和 Alpha 透明度的缩写. 也就是说该属性可以帮助我们在设置颜色的同时,也设置了其透明度. 其实就是 RG ...

  10. C++进程间通信（常用理解例子）-买票

    #include "stdafx.h" #include <iostream>using namespace std; #include "windows.h ...