博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
为textarea添加maxlength功能
阅读量:6846 次
发布时间:2019-06-26

本文共 1762 字,大约阅读时间需要 5 分钟。

hot3.png

如果只是單純地想限制 textarea 中的字數,不想寫太多的話,可用:
<textarea οnkeyup="this.value = this.value.slice(0, 80)"></textarea>
<textarea οnkeyup="this.value = this.value.substring(0, 80)"></textarea>
o 在 textarea 的 onkeyup 中檢查字數之方法:
.....
<script language="javascript" type="text/javascript">
function DjCheckMaxlength(oInObj)
{
    var iMaxLen = parseInt(oInObj.getAttribute('maxlength'));
    var iCurLen = oInObj.value.length;
    if ( oInObj.getAttribute && iCurLen > iMaxLen )
    {
        oInObj.value = oInObj.value.substring(0, iMaxLen);
    }
} //@ END OF DjCheckMaxlength()
</script>
.....
<textarea maxlength="80" οnkeyup="return DjCheckMaxlength(this);"></textarea>
.....
o 設定好自動去檢查所有的 textarea 之方法:
.....
<head>
<script language="javascript" type="text/javascript">
function DjTextArea_AddMaxlengthAttr()
{
    var aX = document.getElementsByTagName_r('textarea');
    for ( var iI = 0; aX.length > iI; iI++ )
    {
        if ( aX[iI].getAttribute('maxlength') )
        {
            aX[iI].onkeyup = aX[iI].onchange = DjTextArea_CheckMaxlength;
        }
    }
} //@ END OF DjTextArea_AddMaxlengthAttr()
function DjTextArea_CheckMaxlength()
{
    var iMaxLen = parseInt(this.getAttribute('maxlength'));
    var iCurLen = this.value.length;
    if ( this.getAttribute && iCurLen > iMaxLen )
    {
        this.value = this.value.substring(0, iMaxLen);
    }
} //@ END OF DjTextArea_CheckMaxlength()
</script>
</head>
.....
<body οnlοad="DjTextArea_AddMaxlengthAttr();">
首先在textarea 上定义一个 maxlength 属性:
<textarea rows="3" cols="40" maxlength="200" οnkeydοwn="checklength(this);"></textarea>
然后添加这个方法就行了!
function checklength(obj) {
        var max = obj.maxlength; 
        if(max == null || max == "" || max == undefined) {
            return;
        }
        if(obj.value.length > max) {
            alert("请不要超过最大长度:" + max);
            obj.value=obj.value.substring(0,(max-1));
            return;
        }
    }

转载于:https://my.oschina.net/xuqiang/blog/104310

你可能感兴趣的文章
SSM项目遇到的问题(三)
查看>>
在 React 中处理数据流问题的一些思考
查看>>
Vue CLI 3.x开发环境搭建
查看>>
小白学python系列-(1)环境的安装
查看>>
Spring Cloud自定义引导属性源
查看>>
Android之UI学习篇六:ImageView实现图片旋转和缩放
查看>>
我的友情链接
查看>>
宿主机与vmware fedora 9.0 共享文件(samba共享)
查看>>
No package 'eventlog' found
查看>>
JDK7 源码学习系列——ClassLoader
查看>>
设计twitter(包含打分,获取,关注,取关)Design Twitter
查看>>
用ASA931做SSL ***
查看>>
eclipse 快捷键
查看>>
基于php&mysql实现聊天室功能的代码实例分享
查看>>
使用Qt实现简单的图片预览效果
查看>>
microsoft office 2013 完全 卸载 工具 来自微软官方
查看>>
在linux下,在校园网上网(经验分享)
查看>>
exchange 2016 EMS控制台报错Winrm HTTP 403
查看>>
面向对象学习(4):抽象的意义
查看>>
AgileEAS.NET平台开发实例-智能升级及服务器部署
查看>>