Форум

LRCenter · #1 (**permalink**) 11.08.2010, 16:31

Здравствуйте. В JS я новичок. Хочу сделать счетчик симовлов и "веса текста" для текстового поля. Получилось вот как:

<html>
<head>
<script>
function counter(el)
{

el=el.replace(/<\/?[^>]+>/g, '');
document.getElementById('count').innerHTML = el.value.length;
document.getElementById('kb').innerHTML = (el.value.length/1024).toFixed(2);
}
</script>
</head>
<body>
Вы ввели: <span id='count'>0</span> символов. <span id='kb'>0</span>Kb
<form>
<textarea id="text" onkeypress="counter(this);" onkeyup="counter(this);" onchange="counter(this);"></textarea><br>
</form>
</body>
</html>

Все работет, но я хотел чтобы считалось без учета тэгов, поэтому получилось, хотел вставить вот такую строку с регулярным выражением.

el=el.replace(/<\/?[^>]+>/g, '');

После этого все все вообще перестает работать. В чем дело, что не так?

exec · #2 (**permalink**) 11.08.2010, 16:39

Надёжней всего делать через DOM:

<html>
<head>
<script>
function counter(el)
{
var wrapper = document.createElement('DIV');
wrapper.innerHTML = el.value;
var len = (wrapper.textContent || wrapper.innerText).length;
document.getElementById('count').innerHTML = len;
document.getElementById('kb').innerHTML = (len/1024).toFixed(2);
}
</script>
</head>
<body>
Вы ввели: <span id='count'>0</span> символов. <span id='kb'>0</span>Kb
<form>
<textarea id="text" onkeypress="counter(this);" onkeyup="counter(this);" onchange="counter(this);"></textarea><br>
</form>
</body>
</html>

LRCenter · #3 (**permalink**) 11.08.2010, 16:51

Спасибо, exec, вы просто кудесник! А как красиво сделать что-бы считал еще сразу через | с учетом тэгов? Я думаю что смогу сделать, но думаю такого нагорожу))))

exec · #4 (**permalink**) 11.08.2010, 17:03

<html>
<head>
<script>
function counter(el)
{
var wrapper = document.createElement('DIV');
wrapper.innerHTML = el.value;
var len = (wrapper.textContent || wrapper.innerText).length;
document.getElementById('count').innerHTML = len + ' | ' + el.value.length;
document.getElementById('kb').innerHTML = (len/1024).toFixed(2);
}
</script>
</head>
<body>
Вы ввели: <span id='count'>0</span> символов. <span id='kb'>0</span>Kb
<form>
<textarea id="text" onkeypress="counter(this);" onkeyup="counter(this);" onchange="counter(this);"></textarea><br>
</form>
</body>
</html>

LRCenter · #5 (**permalink**) 11.08.2010, 17:07

Еще раз большое спасибо!

MCB · #6 (**permalink**) 29.09.2012, 10:43

А можно-ли изменить скрипт, чтобы не считал только теги?
сейчас он не считает <dsds>

Aetae · #7 (**permalink**) 29.09.2012, 11:04

<dsds> - вполне себе html5 тег.

MCB · #8 (**permalink**) 29.09.2012, 11:06

значит не удачный пример, не тег к примеру <di3bsik>

Aetae · #9 (**permalink**) 29.09.2012, 11:12

Нет, я к тому что что угодно в <> - рабочий тег.

Форум

Справочник

Discord чат

Курсы javascript