16.12.2016, 00:58
|
Интересующийся
|
|
Регистрация: 21.11.2016
Сообщений: 28
|
|
Ограничение символов для нескольких 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.
|
|
16.12.2016, 08:35
|
|
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,217
|
|
Сообщение от nekada
|
Все работает на ура с одним текстовым поле, но ситуация такова, что их можно добавить несколько штук, но id у них разное!
<input readonly type="text" name="count" size="3" value="100">
|
Тут ведь нет ИД.
Сообщение от nekada
|
Как привязать input с оставшиеся символами к определенному текстовому полю через его id.
|
Как вариант...
Передавать тот ИД в функцию, а там уже использовать элемент с этим ИД...
|
|
16.12.2016, 10:17
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
nekada,
А покажите фрагмент вашего html с несколькими текстареа и инпутами. Они все в одной form?
|
|
16.12.2016, 12:33
|
Интересующийся
|
|
Регистрация: 21.11.2016
Сообщений: 28
|
|
Сообщение от ksa
|
Как вариант...
Передавать тот ИД в функцию, а там уже использовать элемент с этим ИД...
|
Вы можете показать как это сделать на примере? Собственно в этом и был вопрос)
|
|
16.12.2016, 12:51
|
Профессор
|
|
Регистрация: 27.11.2015
Сообщений: 2,899
|
|
Вообще без 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>
Последний раз редактировалось Dilettante_Pro, 16.12.2016 в 13:57.
|
|
16.12.2016, 22:05
|
Интересующийся
|
|
Регистрация: 21.11.2016
Сообщений: 28
|
|
Блин! Реально круто работает, я так понял всё дело только в этом?
onkeypress="limitText(this,this.nextElementSibling,100);"
Заметил, что если поставить br между textarea и input, тогда не работает )
|
|
16.12.2016, 22:21
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
<!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>
|
|
16.12.2016, 22:40
|
Интересующийся
|
|
Регистрация: 21.11.2016
Сообщений: 28
|
|
рони,
Ваш вариант еще круче, даже в телефоне работает, но я имел ввиду 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>
|
|
16.12.2016, 22:42
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
Сообщение от nekada
|
структура такая
|
это не важно.
|
|
16.12.2016, 22:44
|
Интересующийся
|
|
Регистрация: 21.11.2016
Сообщений: 28
|
|
рони,
Просто я пишу в одном поле,а символы считает в другом, которое ниже, а в самом последнем поле совсем ничего не считает пиши сколько хочешь ))))
|
|
|
|