この効果は関数に統合されています。この関数は 3 つのパラメータを受け入れます。
1 つ目はテキストエリアまたはその他のテキスト フォームの ID です。
2 つ目は表示される入力コンテンツの ID であり、空白のままにすることができます。
3番目は最も多く入力される文字で、漢字1文字が2文字です。
これは単なる基本的な効果であり、学生はこれを最適化して改善することができます。
コードを入手するには、デモのソース ファイルを表示してください
外部 Js を導入する必要がある場合は、<script>
function lengthLimit(elem, showElem, max){
var elem = document.getElementById(elem);
var showElem = document.getElementById(showElem);
var max = max || 50;// 最大限度字符，汉字按两个字符计算
function getTextLength(str){// 获取字符串的长度 一个汉字为2个字符
return str.replace(/[^\x00-\xff]/g,"xx").length;
};
// 监听textarea的内容变化
if(/msie (\d+\.\d)/i.test(navigator.userAgent) == true) {// 区分IE
elem.onpropertychange = textChange;
}else{
elem.addEventListener("input", textChange, false);
}
function textChange(){// 内容变化时的处理
var text = elem.value;
var count = getTextLength(text);
if(count > max){// 文字超出截断
for(var i=0; i<text.length; i++){
if(getTextLength(text.substr(0, i)) >= max){
elem.value = text.substr(0, i);
if(showElem) showElem.innerHTML = elem.value;// 显示输出结果
break;
};
}
}else{
if(showElem) showElem.innerHTML = elem.value;// 显示输出结果
};
};
textChange();// 加载时先初始化
};
</script> を実行するために更新する必要があります]
