Ограничение символов для нескольких textarea
Тук, тук, здрасте.
есть скприт
<script>
function limitText(limitField, limitCount, limitNum) {
if (limitField.value.length > limitNum) {
limitField.value = limitField.value.substring(0, limitNum);
} else {
limitCount.value = limitNum - limitField.value.length;
}
}
</script>
<textarea id="1" onKeyDown="limitText(this,this.form.count,100);" onKeyUp="limitText(this,this.form.count,100);"></textarea> <input readonly type="text" name="count" size="3" value="100"> осталось символов Все работает на ура с одним текстовым поле, но ситуация такова, что их можно добавить несколько штук, но id у них разное! И input перестает считать символы, подскажите как это можно поправить. Как привязать input с оставшиеся символами к определенному текстовому полю через его id.:thanks: |
Цитата:
Цитата:
Передавать тот ИД в функцию, а там уже использовать элемент с этим ИД... |
nekada,
А покажите фрагмент вашего html с несколькими текстареа и инпутами. Они все в одной form? |
Цитата:
|
Вообще без id
<textarea oninput="limitText(this,this.nextElementSibling,100);"></textarea>
<input readonly type="text" name="count" size="3" value="100"> осталось символов
<textarea onkeydown="limitText(this,this.nextElementSibling,100);"></textarea>
<input readonly type="text" name="count" size="3" value="100"> осталось символов
<textarea onkeyup="limitText(this,this.nextElementSibling,100);"></textarea>
<input readonly type="text" name="count" size="3" value="100"> осталось символов
<textarea onkeypress="limitText(this,this.nextElementSibling,100);"></textarea>
<input readonly type="text" name="count" size="3" value="100"> осталось символов
<script>
function limitText(limitField, limitCount, limitNum) {
if (limitField.value.length > limitNum) {
limitField.value = limitField.value.substring(0, limitNum);
} else {
limitCount.value = limitNum - limitField.value.length;
}
}
</script>
|
Блин! Реально круто :) работает, я так понял всё дело только в этом?
onkeypress="limitText(this,this.nextElementSibling,100);" Заметил, что если поставить br между textarea и input, тогда не работает ) |
:)
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script>
window.addEventListener('DOMContentLoaded', function() {
var inp = document.querySelectorAll('[name="count"]');
[].forEach.call(document.querySelectorAll('textarea'), function(area, i) {
var count = inp[i], limit = count.value;
area.addEventListener('input', function() {
area.value = area.value.substring(0, limit);
count.value = limit - area.value.length;
});
});
});
</script>
</head>
<body>
<textarea></textarea>
<input readonly type="text" name="count" size="3" value="100"> осталось символов<br>
<textarea></textarea>
<input readonly type="text" name="count" size="3" value="100"> осталось символов<br>
<textarea></textarea>
<input readonly type="text" name="count" size="3" value="100"> осталось символов<br>
<textarea></textarea>
<input readonly type="text" name="count" size="3" value="100"> осталось символов<br>
</body>
</html>
|
рони,
Ваш вариант еще круче, даже в телефоне работает, но я имел ввиду br между textarea и input, а структура такая <li> <img> <textarea></textarea> <br> <input readonly type="text" name="count" size="3" value="100"> осталось символов<br> <span><a href="#">ссылко</a></span> </li> и т.д <li> <img> <textarea></textarea> <br> <input readonly type="text" name="count" size="3" value="100"> осталось символов<br> <span><a href="#">ссылко</a></span> </li> и т.д <li> <img> <textarea></textarea> <br> <input readonly type="text" name="count" size="3" value="100"> осталось символов<br> <span><a href="#">ссылко</a></span> </li> |
Цитата:
|
рони,
Просто я пишу в одном поле,а символы считает в другом, которое ниже, а в самом последнем поле совсем ничего не считает :) пиши сколько хочешь :))))) |
nekada,
не понимаю |
рони,
Ну смотрите, я пишу в верхнем поле, а input считает символы в поле, которое ниже, если пишу в поле , которое ниже, input считает возле поля, которое еще ниже, а если уже пишу в самом нижнем поле последним, он совсем ничего не считает, и текста можно набрать хоть 1000 символов. А с самым верхнем полем input совсем не считает, но больше 100 символов туда не зарядишь. Мистика да и только ) |
nekada,
не осилил, пишите код и описание проблемы
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script>
window.addEventListener('DOMContentLoaded', function() {
var inp = document.querySelectorAll('li [name="count"]');
[].forEach.call(document.querySelectorAll('li textarea'), function(area, i) {
var count = inp[i], limit = count.value;
area.addEventListener('input', function() {
area.value = area.value.substring(0, limit);
count.value = limit - area.value.length;
});
});
});
</script>
</head>
<body>
<ul>
<li>
<img>
<textarea></textarea>
<br>
<input readonly type="text" name="count" size="3" value="100"> осталось символов<br>
<span><a href="#">ссылко</a></span>
</li>
<li>
<img>
<textarea></textarea>
<br>
<input readonly type="text" name="count" size="3" value="100"> осталось символов<br>
<span><a href="#">ссылко</a></span>
</li>
<li>
<img>
<textarea></textarea>
<br>
<input readonly type="text" name="count" size="3" value="100"> осталось символов<br>
<span><a href="#">ссылко</a></span>
</li>
</ul>
</body>
</html>
|
Блин я его в тело пихал, а сейчас в head запихнул стало норм работать, спасибо большое :)
|
| Часовой пояс GMT +3, время: 03:07. |