现在发微博,那个文本框一般只能输入200字好像,再多就会自动删除,要么是提示字数受限,用Js就可实现本功能。今天带来的这个Js限制表单文本 框文字数量的例子,相信有此方面需要的是个不错的参考。为了便于使用,这里把代码拆分为HTML表单部分和JavaScript代码部分:

HTML表单部分,代码如下:

<form name=myform action="">
<textarea name="message" wrap="physical" cols="28" rows="4" onKeyDown="textCounter(this.form.message,this.form.remLen,125);" onKeyUp="textCounter(this.form.message,this.form.remLen,125);"></textarea>
<br>
您还可以输入<input readonly type="text" name="remLen" size="4" maxlength="3" value="125">个字符</div>
</form>

JavaScript代码部分:

<SCRIPT LANGUAGE="JavaScript">
function textCounter(field, countfield, maxlimit) {
// 定义函数,传入3个参数,分别为表单的名字,表单域元素名,字符限制
if (field.value.length > maxlimit)
//如果元素区字符数大于最大字符数,按照最大字符数截断
field.value = field.value.substring(0, maxlimit);
else
//在表单页文本框内显示可输入的剩余字符数
countfield.value = maxlimit - field.value.length;
}
</SCRIPT>

注:两段代码可复制到同一页面中。

js限制textarea文本框的文字个数的更多相关文章

  1. javascript实现记录文本框内文字个数

    最近在做一个项目中遇到这样一个问题,要对文本框中用户输入的文字进行记数,在下面显示出来,因为我们做的是一个短信发送平台,现在我们国家的短信服务,如果你的信息超过了70个字符,短信就会按二条给你下发.所 ...

  2. js实现文本框输入文字个数限制代码

    html: <div class="curr_eval_box">                <input type="hidden" n ...

  3. js正则表达式限制文本框只能输入数字,小数点,英文字母

    1.文本框只能输入数字代码(小数点也不能输入)<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafter ...

  4. 如何限制textarea文本框的输入字数

    代码实例如下: <!doctype html><html><head><meta charset="UTF-8"><title ...

  5. html5文本框提示文字属性为placeholder

    html5文本框提示文字属性为placeholder 例子:  <textarea id="comment" class="commentCont"  n ...

  6. Jquery实现 TextArea 文本框根据输入内容自动适应高度

    原文 Jquery实现 TextArea 文本框根据输入内容自动适应高度 在玩微博的时候我们可能会注意到一个细节就是不管是新浪微博还是腾讯微博在转发和评论的时候给你的默认文本框的高度都不会很高,这可能 ...

  7. jQuery实现限制input框 textarea文本框输入字符数量的方法

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  8. 限制textarea 文本框的长度(收集了几个办法)

    文章参考地址:http://blog.csdn.net/nhconch/article/details/4223076 需求背景: 前几天,因为客户有一个需求说,需要对一个评论(一个textarea文 ...

  9. TextBox 文本框水印文字

    #region TextBox 文本框水印文字 /// <summary> /// 基于.NET 2.0的TextBox工具类 /// </summary> public st ...

随机推荐

  1. Windows 7 mklink命令详解

    mklink是Windows 7下的一个类似于linux下In的命令,其作用是在NTFS文件系统中创建文件或目录的链接(类似于桌面快捷方式).如果加以利用其发挥的作用是非常的大的,不仅可以帮助我们节省 ...

  2. UVA138 Street Numbers(数论)

    题目链接. 题意: 找一个n,和一个m(m < n),求使得1~m的和等于m~n的和,找出10组m,n 分析: 列出来式子就是 m*(m+1)/2 = (n-m+1)*(m+n)/2 化简后为 ...

  3. Binary Search Tree Iterator——LeetCode

    Implement an iterator over a binary search tree (BST). Your iterator will be initialized with the ro ...

  4. 甲骨文公司 Oracle

    甲骨文公司 甲骨文公司,全称甲骨文股份有限公司,是全球最大的企业软件公司,总部位于美国加利福尼亚州的红木滩.甲骨文是继Microsoft之后,全球收入第二多的软件公司.甲骨文公司1989年正式进入中国 ...

  5. Android Studio 遇见的第一个Error

    最近在国内多次尝试在Eclipse下更新SDK无果后,最后终于通过FQ后结束了Google服务器无法访问的噩梦. 顺着墙外的梯子,一并下载Google的Android Studio尝鲜,安装成功后,就 ...

  6. thead、tbody、tfoot与顺序无关

    今天发现一个问题,thead.tbody.tfoot等标签的内容排版与顺序无关,做了一个小的实验:

  7. 更改navigationController push和pop界面切换动画

    For Push: MainView *nextView=[[MainView alloc] init]; [UIView beginAnimations:nil context:NULL]; [UI ...

  8. 那些年,学swift踩过的坑

    最近在学swift,本以为多是语法与oc不同,而且都是使用相同的cocoa框架,相同的API,但是或多或少还是有些坑在里,为了避免以后再踩,在这里记下了,以后发现新的坑,也会慢慢在这里加上 [TOC] ...

  9. 更改Zend Studio/Eclipse代码风格主题

    最近决定把几个IDE的代码样式统一一下,Visual Studio的还算好改,PHP目前用得不多,不过也打算给Zend Studio换身新装. 网上搜索的一些更改Zend Studio主题的多是修改或 ...

  10. .Net程序猿玩转Android开发---(3)登陆页面布局

    这一节我们来看看登陆页面如何布局.对于刚接触到Android开发的童鞋来说.Android的布局感觉比較棘手.须要结合各种属性进行设置,接下来我们由点入面来 了解安卓中页面如何布局,登陆页面非常eas ...