限制textarea 文本框的长度maxlength(针对IE8不支持该属性之解决办法)

实现计齐截:用maxlength属性

<textarea maxlength="10"></textarea>

这个别式格式很简单的哦,然则 在我这边测试的时辰,并不克不及完全兼容主流浏览器

兼容性结果如下:

IE8 Firefox 17 Chrome 23

不兼容 兼容 兼容

实现规划二:用javascript实现

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

这里就用到了一个onKeyDown。然则结果也不太幻想。

兼容性结果如下:

IE8 Firefox 17 Chrome 23

兼容 不兼容 兼容

实现规划三:综合上方的办法

因为上方无法兼容IE 和firefox,没办法,只能贱一点了!~所以,我就把上方的办法给综合起来~~

代码如下:

<textarea name="txt1" cols="45" maxlength="20" rows="2"

onKeyDown=""if (this.value.length>=20){event.returnValue=false}"">b</textarea>

重视哦,我只是把maxlength加上了!

兼容性结果如下:

IE8 Firefox 17 Chrome 23

兼容 兼容 兼容

原因很简单,maxlength是对firefox和chrome兼容,而那js代码是对IE 兼容。所以就ok啦!!我把

嘻嘻。。那天因为要提交这个ticket 所以急着交咯,反正客户那边经由过程啦。。哇哇哇。。

实现规划四:JavaScript的substring

<textarea name="blogdesc" cols="50" rows="5" οnkeyup="limitLength(this,20)">x </textarea>

兼容性结果如下:

IE8 Firefox 17 Chrome 23

兼容 兼容 兼容

然则,其实这个固然上方三个都兼容,然则有一个很不友爱的题目是,当你达到字符限制的时辰,它还会打出来,直到你松开按键的时辰就好了。不过,这个时辰 会有闪一下把后面多余的字符给删除了!~。不太友爱哦!~亲。

实现规划五:JavaScript

<textarea maxlength="10" onpropertychange="onmyinput(this)" οninput="return onmyinput(this)"

οnpaste="return onmypaste(this);" οnkeypress="return onmykeypress(this);"></textarea>

js代码是:

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.ion.createRange().text.length > 0) {

var ovalueandclipboarddata = o.value + window.clipboardData.getData("Text");

if (o.getAttribute && ovalueandclipboarddata.length - document.ion.createRange().text.length > nMaxLen) {

if (window.clipboardData.getData("Text").substring(0, document.ion.createRange().text.length + nMaxLen - o.value.length) != "")

window.clipboardData.setData("Text", window.clipboardData.getData("Text").substring(0, document.ion.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.ionStart < o.ionEnd) {

var ovalueandclipboarddata = o.value + mygetclipdata();

if (o.getAttribute && (ovalueandclipboarddata.length - o.ionEnd + o.ionStart > nMaxLen)) {

if (mygetclipdata().substring(0, o.ionEnd - o.ionStart + nMaxLen - o.value.length) != "")

mysetclipdata(mygetclipdata().substring(0, o.ionEnd - o.ionStart + 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.ionStart < o.ionEnd)

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.ion.createRange().text.length > 0)

return true;

if (o.value.length >= o.getAttribute("maxlength"))

return false;

else

return true;

}

}

IE8 Firefox 17 Chrome 23

兼容 兼容 兼容

文章来源:http://www.binvor.com/a/xinxizhongxin/wangluokaifajishu/2012/1216/13427.html


版权声明:本文为asadavas原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
THE END
< <上一篇
下一篇>>