Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   механизм с checkbox'ами (https://javascript.ru/forum/jquery/23624-mekhanizm-s-checkbox%27ami.html)

vyrtime 30.11.2011 10:12

механизм с checkbox'ами
 
есть такой пример,
структура:
<ul>
  <li><input id='av1' name='av1' type='checkbox'/>Все</li>
</ul>
<ul>
  <li><input id='1' name='1' av='1' type='checkbox'/><a class='a_ch' id='a1' href='#'>Пример 1</a></li>
  <li><input id='2' name='2' av='1' type='checkbox'/><a class='a_ch' id='a2' href='#'>Пример 2</a></li>
  <li><input id='3' name='3' av='1' type='checkbox'/><a class='a_ch' id='a3' href='#'>Пример 3</a></li>
</ul>

скрипт(ставит и убирает галочки при нажатии на ссылки):
$(document).ready(function(){
  $('a.a_ch').click(function(){
    var input_id = $(this).attr('id').substr(1);
    $('#'+input_id+':checkbox').each(function(){
      this.checked = !this.checked;	
    });
    return false;
  });
});

как сделать так, чтобы скрипт работал таким образом:
если хотя бы одна галочка у примеров нажата, то ставить автоматически галочку у чекбокса "Все";
если ни у одного чекбокса из примеров не стоит галочка, то скрипт автоматически убирает галочку у чекбокса "Все"

спрошу поточнее - как сделать проверку на то, стоят ли галочки у чекбоксов?

ksa 30.11.2011 10:52

Цитата:

Сообщение от vyrtime
как сделать проверку на то, стоят ли галочки у чекбоксов?

Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(document).ready(function(){
	$('button').click(function(){
		var val=$('[av=1]:checked').length;
		if (val==0) {
			alert('Нет выбраных...');
		} else {
			alert('Выбрано '+val+'шт.');
		};
	});
});
</script>
</head>
<body>
<ul>
	<li><input id='av1' name='av1' type='checkbox'/>Все</li>
</ul>
<ul>
	<li><input id='1' name='1' av='1' type='checkbox'/><a class='a_ch' id='a1' href='#'>Пример 1</a></li>
	<li><input id='2' name='2' av='1' type='checkbox'/><a class='a_ch' id='a2' href='#'>Пример 2</a></li>
	<li><input id='3' name='3' av='1' type='checkbox'/><a class='a_ch' id='a3' href='#'>Пример 3</a></li>
</ul>
<button>Проверить</button>
</body>
</html>

vyrtime 30.11.2011 10:59

спасибо большое! решено


Часовой пояс GMT +3, время: 13:03.