флажок "Заполнить", когда текст находится в текстовой области в javascript

#javascript

Вопрос:

У меня есть форма текстовой области, подобная этой:

 <input id="sg_0" name="sjalfgefid" type="text" class="letur hvitur" size="8" maxlength="40" value=""></td>

и флажок рядом с ним:

 <input type="Checkbox" id="cb0" name="innsent" tegund="val" gildi="eink" value="0" number="0" parents="1" onclick="hakaVid(this)">

Я хочу, чтобы флажок был заполнен, когда в текстовой области записывается какой-либо текст. И когда пользователь удаляет весь текст из текстового поля, я хочу, чтобы флажок немедленно обновился
Как я могу это сделать?

Ответ №1:

Прикрепите обработчик onKeyUp событий к <input> и измените значение флажка в соответствии с this.value.length .

 <input id="sg_0" name="sjalfgefid" type="text" class="letur hvitur" 
       size="8" maxlength="40" value="" 
       onkeyup="document.getElementById('cb0').checked = this.value.length > 0;">

Пример: http://jsfiddle.net/qG5Cu /

ОБНОВЛЕНИЕ Вам может быть интересно использовать обработчик onInput событий вместо onkeyup . Смотрите эту ссылку для получения дополнительной информации: использование обработчика события oninput с onkeyup / onkeydown в качестве запасного варианта

1. что, если бы я хотел, чтобы 0 отличался от идентификатора текстового поля? Допустим, что следующая текстовая область — ‘cb1’. Это не работает. Если k — идентификатор: document.getElementById(‘cb’ k ).checked = this.value . длина> 0

2. k должна быть определенной переменной. Как вы создаете эти компоненты? Просто введите правильное имя переменной в цикл, который вы используете для их генерации, или задайте обработчик событий программно ( input.onkeyup = function(){ ... } ).

3. Или вы можете извлечь соответствующую часть идентификатора (номер) с this.id помощью substring : document.getElementById('cb' this.id.substring(3)).checked = this.value.length > 0;" . Вам действительно нужно уточнить, чего вы хотите достичь, и как вы создаете эти компоненты

4. Большое спасибо. Я использовал this.id.substring для получения идентификатора из текстовой области, потому что число всегда совпадает с флажком. 🙂

5. Еще один вопрос. Что, если я хочу, чтобы флажок не мог проверять / снимать флажок, когда некоторые символы находятся в текстовой области. Только когда текстовая область пуста. Как бы мне это сделать?

Ответ №2:

Я думаю, вам следует попробовать с событиями ввода, проверить w3c: входной тег

1. W3c != w3schools . w3fools.com , Используйте MDN для ссылки на JS/CSS/html/… документация: developer.mozilla.org

2. W3Schools никоим образом не связан с W3C и часто является неточным ресурсом. Это спецификация W3C для <input> элементов.