Есть простейший скрипт, подсчитывающий количество знаков в поле textarea. Вот он:
<!doctype html>
<html>
<head>
<script>
function countChars(name) {
var els = document[name].getElementsByTagName("textarea");
for (var i = 0; i < els.length; i++)
els[i].onkeyup = function () {
document[name]['field' + this.name].value = this.value.length;
};
}
</script>
<title>Счетчик</title>
</head><body>
<div class="wrap">
<form action="script.cgi" method="post" name="new_record" id="web">
<fieldset><label for="text">Текст
<br><span class="ta_count">знаков <input type="text" name="fieldtext" disabled></span></label>
<textarea id="text" name="text" placeholder="" required></textarea>
</fieldset>
<script>countChars('new_record');</script>
<input type="submit" value="Добавить запись"> <input type="reset" value="Сброс">
</form>
</div>
</body></html>
Возникла необходимость работать с несколькими одинаковыми формами на странице. Вот так, например:
<!doctype html>
<html>
<head>
<script>
function countChars(name) {
var els = document[name].getElementsByTagName("textarea");
for (var i = 0; i < els.length; i++)
els[i].onkeyup = function () {
document[name]['field' + this.name].value = this.value.length;
};
}
</script>
<title>Счетчик</title>
</head><body>
<div class="wrap">
<form action="script.cgi" method="post" name="new_record" id="web">
<fieldset><label for="text">Текст
<br><span class="ta_count">знаков <input type="text" name="fieldtext" disabled></span></label>
<textarea id="text" name="text" placeholder="" required></textarea>
</fieldset>
<script>countChars('new_record');</script>
<input type="submit" value="Добавить запись"> <input type="reset" value="Сброс">
</form>
<form action="script.cgi" method="post" name="new_record" id="web">
<fieldset><label for="text">Текст
<br><span class="ta_count">знаков <input type="text" name="fieldtext" disabled></span></label>
<textarea id="text" name="text" placeholder="" required></textarea>
</fieldset>
<script>countChars('new_record');</script>
<input type="submit" value="Добавить запись"> <input type="reset" value="Сброс">
</form>
</div>
</body></html>
Изменить названия и идентификаторы форм, а также поля "text" нельзя, а поля, где отображаются счетчики - можно. Например, можно их пронумеровать.
Непонятно как изменить скрипт. Пробовал так, но не работает:
function countChars(name, number) {
...
document[name]['field' + this.name + number].value = this.value.length;
Подскажите, пожалуйста, как работать с несколькими формами на одной странице в данном случае?
Жаль только, что не всё в нем понятно. И есть еще одна проблемка. Форму для примера я сильно упростил для наглядности. Но дело в том, что в реальной форме есть несколько полей textarea и в javascript'е надо их формировать "на лету". Вот это и непонятно как?
