Хаки и Скрипты Next Generation CMS : JS, html : Счетчик символов текстовом поле textarea

irbees2008 Опубликовано - 21 - февраля JS

Адаптировал: irbees2008
Уровень сложности исполнения: нужны навыки css html

Вот попросили выложить счетчик символов введенных в поле textarea,в принципе он подходит для любых полей.

Итак
1.Подключаем скрипт счетчика перед формой

Код:

<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>

2.Добавляем параметры в наше поле ,у нас это textarea и в него добавляем

Код:

onkeypress="counter(this);" onkeyup="counter(this);" onchange="counter(this);

и у нас получилось

Код:

<textarea name="ng_news_content" id="ng_news_content" rows="10" tabindex="2" onkeypress="counter(this);" onkeyup="counter(this);" onchange="counter(this);"></textarea>

3.Теперь скрипт считает символы и теперь нам надо вывести что посчитал скрипт ,после текстового поля добавляем

Код:

<BR/>Вы ввели: <span id='count'>0</span> символов. <span id='kb'>0</span>Kb

Вот и все .

Можешь почитать и вот эту статейку "Выводим блок по времени на TWIG"

Это тоже интересно

Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.