テキストエリアの文字数を1行ごとにカウントさせたい
テキストエリアの文字カウンターで躓いております。ご助力を頂ければと思います。
先ず条件ですが、
1:半角は0.5、全角は1.0としてカウントする
2:改行、スペースはカウントしない
3:3行目まで1行ごとにカウントする(4行目以降は無視)
現在の問題点
半角と全角の判定が無視されているようで半角でも1.0としてカウントされてしまいます。
以上になります。
function ShowLength( str ) {
var len = 0;
//文字サイズのチェック
for(i=0;i<str.length;i++) {
var c = str.charCodeAt(i);
if ( (c >= 0x0 && c < 0x81) || (c == 0xf8f0) || (c >= 0xff61 && c < 0xffa0) || (c >= 0xf8f1 && c < 0xf8f4)){
len += 0.5;
}
else { len += 1; }
}
//分割
var arr = str.split(/\r\n|\r|\n/);
for(i=0;i<arr.length;i++){
// log確認用
console.log("arr["+i+"]の文字数は"+arr[i].length+"です");
}
ShowLength.innerHTML = len.toFixed(1);
document.getElementById("inputlength01").innerHTML = arr[0].length;
document.getElementById("inputlength02").innerHTML = arr[1].length;
document.getElementById("inputlength03").innerHTML = arr[2].length;
}
<body>
<table>
<tr>
<th>行別カウンター</th>
<td>
<textarea id="input_text" placeholder="" name="summary" rows="5" onkeyup="ShowLength(this.value,'inputlength');"></textarea>
<div class="countWrrap">
<div class="countDsign">
<ul>
<li id="comment01">1行目: <span id="inputlength01">0.0 </span>/ 35</li>
<li id="comment02">2行目: <span id="inputlength02">0.0 </span>/ 35</li>
<li id="comment03">3行目: <span id="inputlength03">0.0 </span>/ 35</li>
</ul>
</div>
</div>
</td>
</tr>
</table>
</body>