我有以下代码,它在 IE 中完美地用于 textarea 元素。
<textarea name="mem_message" cols="25" rows="5"
onkeypress="return taLimit(this)"
onkeyup="return taCount(this,'myCounter')">
<? echo $_SESSION['mem_message']; ?>
</textarea>
它调用一个验证函数:
<script language="Javascript"><!--Counter for Message Box -->
maxL=100;
var bName = navigator.appName;
function taLimit(taObj) {
if (taObj.value.length==maxL) return false;
return true;
}
function taCount(taObj,Cnt) {
objCnt=createObject(Cnt);
objVal=taObj.value;
if (objVal.length>maxL) objVal=objVal.substring(0,maxL);
if (objCnt) {
if(bName == "Netscape"){
objCnt.textContent=maxL-objVal.length;}
else{objCnt.innerText=maxL-objVal.length;}
}
return true;
}
function createObject(objId) {
if (document.getElementById) return document.getElementById(objId);
else if (document.layers) return eval("document." + objId);
else if (document.all) return eval("document.all." + objId);
else return eval("document." + objId);
}
</script>
以上所有仅适用于 IE。在 Firefox 上,它甚至不会关注框。
最佳答案
几点建议:
- 不要使用 language="javascript",它已被弃用。
- 不要使用
eval
进行属性访问,它很慢而且没有必要。 - 不要嗅探“Netscape”,而是检查属性/方法是否存在/合规性 (innerText/textContent)
- 不要将接收元素的方法命名为“createObject”,这会产生误导。
- 不要执行未声明的赋值 (
maxL = 100
),这很容易出错。 - 为了约定,不要将不是构造函数(或 namespace )的变量名称大写。
- 尽量不要在全局范围内声明函数,以避免名称冲突。
关于Firefox 上的 JavaScript 验证功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1296597/