`

给textarea增加长度限制的几种方法

    博客分类:
  • js
 
阅读更多

自己写的支持ie ff chorm的长度限制

 

 

	function lengthLmit(){
		var evt = window.event || arguments.callee.caller.arguments[0]; // 获取event对象
		var src = evt.srcElement || evt.target; // 获取触发事件的源对象
		var iKeyCode = evt.keyCode || evt.which; //获取按钮代码
		if (src.value.length>=10){ 
			if (window.navigator.userAgent.indexOf("IE")>=1){
				evt.returnValue=false; 
			}else {
				evt.preventDefault()
			}
		}
	}

 

 <textarea onkeydown="lengthLmit()" rows="8" cols="100"></textarea>
   

 

 

 

 

最简单的:

 

<textarea name="A" cols="45" rows="2" onKeyDown='if (this.value.length>=20){event.returnValue=false}'>aaaa</textarea>

 
简单有效,但问题是输入20个字符后边删除键、光标键通通失效,未够20个字符时粘贴一段长文字也可以突破限制。

 

最粗暴的:

 

<script type="text/javascript">  
function isMaxLen(o){  
 var nMaxLen=o.getAttribute? parseInt(o.getAttribute("maxlength")):"";  
 if(o.getAttribute && o.value.length>nMaxLen){  
 o.value=o.value.substring(0,nMaxLen)  
 }  
}  
</script>
 

 

<textarea maxlength="10" onkeyup="return isMaxLen(this)"></textarea>
 

用户会很疑惑,我明明录入了内容怎么一放手都没了, 而且光标键都跳到后面。

 

最牛的:

 <html>

<head>
<title>IE和FireFox中的textarea长度限制</title>
</head>
<body>
<textarea maxlength="10" onpropertychange="onmyinput(this)" oninput="return onmyinput(this)" onPaste="return onmypaste(this);" onKeyPress="return onmykeypress(this);"></textarea>

 
//功能:IE和FireFox中的textarea长度限制
//作者:铁血骷髅

 

<script type="text/javascript">
function onmyinput(o)
{
 if(o.value.length>=o.getAttribute("maxlength"))
 {
  if(o.value.length>o.getAttribute("maxlength"))
   o.value = o.value.substring(0,o.getAttribute("maxlength"));
  return false;
 }
 return true;
}
function mygetclipdata()
{
 if(!document.all)
 {
  netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');
  var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);
  var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);
  trans.addDataFlavor('text/unicode');
  var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
  clip.getData(trans,clip.kGlobalClipboard);
  var str=new Object();
  var strLength=new Object();
  trans.getTransferData("text/unicode",str,strLength);  
  if (str)
  str=str.value.QueryInterface(Components.interfaces.nsISupportsString);
  var pastetext;
  if (str)
  pastetext=str.data.substring(0,strLength.value / 2); 
  return pastetext;
 }
 else
 {
  return window.clipboardData.getData("Text");
 }
}
function mysetclipdata(o)
{
 if(!document.all)
 {
  netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');
  var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);
  var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);
  trans.addDataFlavor("text/unicode");
  var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
  str.data=o;
  trans.setTransferData("text/unicode",str,o.length*2);
  var clipid=Components.interfaces.nsIClipboard;
  clip.setData(trans,null,clipid.kGlobalClipboard);
 }
 else
 {
  window.clipboardData.setData("Text",o);
 }
}
function onmypaste(o)
{
 var nMaxLen=o.getAttribute? parseInt(o.getAttribute("maxlength")):"";
 if(!document.all)
 {
  alert("不可能执行的代码");
 }
 else
 {
  if(document.selection.createRange().text.length>0)
  { 
   var ovalueandclipboarddata = o.value +window.clipboardData.getData("Text");
   if(o.getAttribute && ovalueandclipboarddata.length-document.selection.createRange().text.length>nMaxLen)
   {
    if(window.clipboardData.getData("Text").substring(0,document.selection.createRange().text.length+nMaxLen-o.value.length)!="")
     window.clipboardData.setData("Text",window.clipboardData.getData("Text").substring(0,document.selection.createRange().text.length+nMaxLen-o.value.length));
    else
     return false;
   }
  }
  else
  {
   var ovalueandclipboarddata = o.value +window.clipboardData.getData("Text");
   if(o.getAttribute && ovalueandclipboarddata.length>nMaxLen)
   {
    if(ovalueandclipboarddata.substring(0,nMaxLen-o.value.length)!="")
     window.clipboardData.setData("Text",ovalueandclipboarddata.substring(0,nMaxLen-o.value.length));
    else
     return false;
   }
  }
  return true;
 }
}
function onmykeypress(o)
{
 if(!document.all)
 {
  var nMaxLen=o.getAttribute? parseInt(o.getAttribute("maxlength")):"";
  if(onmykeypress.caller.arguments[0].ctrlKey == true)
  {
   if(onmykeypress.caller.arguments[0].which==118)
   {
    if(o.selectionStart<o.selectionEnd)
    {
     var ovalueandclipboarddata = o.value + mygetclipdata();
     if(o.getAttribute && (ovalueandclipboarddata.length-o.selectionEnd + o.selectionStart>nMaxLen))
     {
      if(mygetclipdata().substring(0,o.selectionEnd - o.selectionStart+nMaxLen-o.value.length)!="")
       mysetclipdata(mygetclipdata().substring(0,o.selectionEnd - o.selectionStart+nMaxLen-o.value.length));
      else
       return false;
     }
    }
    else
    {
     var ovalueandclipboarddata = o.value +mygetclipdata();
     if(o.getAttribute && ovalueandclipboarddata.length>nMaxLen)
     {
      if(ovalueandclipboarddata.substring(0,nMaxLen-o.value.length)!="")
       mysetclipdata(ovalueandclipboarddata.substring(0,nMaxLen-o.value.length));
      else
       return false;
     }
    }
    return true;
   } 
  }

  if(onmykeypress.caller.arguments[0].which==0 || onmykeypress.caller.arguments[0].which==8)
   return true;
  if(o.value.length>=o.getAttribute("maxlength"))
  {
   if(o.selectionStart<o.selectionEnd)
    return true;
   if(o.value.length>o.getAttribute("maxlength"))
    o.value = o.value.substring(0,o.getAttribute("maxlength"));
   return false;
  }
  else
   return true;
  
 }
 else
 {
  if(document.selection.createRange().text.length>0)
   return true;
  if(o.value.length>=o.getAttribute("maxlength"))
   return false;
  else
   return true;
 }
}
</script>
 

 

</body>
</html>
 

 

只有想不到,没有做不到,写这代码的哥们太太太牛了。

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics