Отправка сообщения






Добро пожаловать!

JavaScript: «Отметить всё»

checkboxПростой и полезный код на JavaScript.
Давайте рассмотрим форму, на которой содержится большое количество флажков (checkbox-ы), и необходимо активировать все эти флажки.
Активировать / Деактивировать все в ручную может занять определенное время, да и не совсем удобно.
Неплохо было бы завести ещё одно поле, которое бы могло выполнить это действие одним нажатием. В общем, суть работы этого скрипта сводиться именно к этому.

Вставляем на страницу следующий код:

<script type="text/javascript">
function select_all (num, prefix, mark){
	for (var i = 0; i &lt;= num; i++)
		document.getElementById ( prefix + i ).checked = mark;
}
</script>

В функцию select_all передаем следующие переменные:
num — суммарное количество флажков;
prefix — общий префикс для id флажков;
mark — значение ключевого флажка (true / false);

Код формы:

<form action="" method="POST"  name="InpList">
<fieldset>
<label><input name="SelAll"  type="checkbox"
onclick="select_all(6,'Elem',document.InpList.SelAll.checked)"> Отметить все</label><br>

<label><input type='checkbox' id='Elem0'> Почта</label><br>
<label><input type='checkbox' id='Elem1'> Форум</label><br>
<label><input type='checkbox' id='Elem2'> Блог Yornet</label><br>
<label><input type='checkbox' id='Elem3'> Рассылка</label><br>
<label><input type='checkbox' id='Elem4'> Медиафайлы</label><br>
<label><input type='checkbox' id='Elem5'> Контакты</label><br>

</fieldset>
</form>

В данном примере поле с именем «SelAll» является ключевым. Активируя/деактивируя его мы запускаем функцию select_all, которая дублирует значение ключевого поля на все поля с префиксом Elem, c кодом num от 0 до 6. В итоге мы получаем то, что и задумали.

Кстати, так же иногда при большом количестве элементов на форме удобно сделать список чекбоксов с прокруткой. Реализовать это не составляет большого труда, и в этом вы можете убедиться сами.

Добавил: htmaker, 11.01.2013 г.
 
плохослабосойдетхорошоотлично (Еще не оценили)
Загрузка...

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Комментарии

  • Загрузка...

Наверх