Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 25.03.2011, 01:01
Аватар для Avron2
Интересующийся
Отправить личное сообщение для Avron2 Посмотреть профиль Найти все сообщения от Avron2
 
Регистрация: 25.03.2011
Сообщений: 26

Как отследить событие $(checbox).change?
Галочку в чекбоксе можно поставить мышкой, а может ее поставить наш скрипт, допустим на нажатие текста "Выделить все".

Как написать скрипт именно на любое изменение состояние чекбокса. Будь то щелчек мыши или мой скрипт ее туда поставил.

Когда пользователь ставит галочку в чекбоксе На событие
$('chekbox11').change(function() ...)
у меня соотвествующая строчка таблицы меняет цвет
if ($('.cbTheme#'+id).attr('checked'))    {
            $(el).addClass('temp');
        } 
        else    {
            $(el).removeClass('temp');
        }


Когда пользователь нажимает текст "Выделить все" должен выполниться тот же вышеизложенный код. Но он не выполняется. Мне приходится писать тот же обработчик события для клика на тексте. Но ведь при клике на тексте, происходит событие изменения состояния chekbox, но вышеизложенный код не выполняется.
Как с этим бороться?
Ответить с цитированием
  #2 (permalink)  
Старый 25.03.2011, 11:14
Аспирант
Отправить личное сообщение для lalala Посмотреть профиль Найти все сообщения от lalala
 
Регистрация: 04.03.2011
Сообщений: 87

<html>
	<head>
		<script type='text/javascript' src='http://code.jquery.com/jquery-1.5.1.min.js'>
		</script>
		<style type="text/css">
		.style1{
			background:yellow;
		}
		</style>
	</head>
	<body>
	<div>
	<span  name="change">
		выделить все
	</span><br>
	<input type="checkbox" name="change"/>
	<br><br>
	<span id="text">
		лалалалалалалалалала
	</span>
	<div>
	<script type='text/javascript'>
		$('[name="change"]').click(function(){
			if ($(this).get(0).tagName !="INPUT") {
				var status=$('input[name="change"]').attr('checked');
				$('input[name="change"]').attr('checked',!status);
			};
			$("#text").toggleClass('style1');
		});
	</script>
	</body>
</html>
Ответить с цитированием
  #3 (permalink)  
Старый 25.03.2011, 12:40
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

lalala,
Использовать одинаковое имя а тем более для span некорректно ...
и 21 строка должен быть закрывающий тег
Вариант через одинаковый class ...
<html>
	<head>
		<script type='text/javascript' src='http://code.jquery.com/jquery-1.5.1.min.js'>
		</script>
		<style type="text/css">
		.style1{
			background:yellow;
		}
		</style>
	</head>
	<body>
	<div>
	<span  class="change" >
		выделить все
	</span><br>
	<input type="checkbox"  class="change" />
	<br><br>
	<span id="text">
		лалалалалалалалалала
	</span>
	</div>
	<script type='text/javascript'>
		$('.change').click(function(){
		    $("#text").toggleClass('style1');
            $('.change:input').attr('checked',$("#text").hasClass('style1'));
		});
	</script>
	</body>
</html>
Ответить с цитированием
  #4 (permalink)  
Старый 25.03.2011, 12:46
Аспирант
Отправить личное сообщение для lalala Посмотреть профиль Найти все сообщения от lalala
 
Регистрация: 04.03.2011
Сообщений: 87

рони,
идея же правильная? а почему не корректно использовать одинаковые имена?
$('.change:input').attr('checked',$("#text").hasCl ass('style1')); а можно поподробнее, тут проверка на наличие стиля и возврат false или true?

Последний раз редактировалось lalala, 25.03.2011 в 12:50.
Ответить с цитированием
  #5 (permalink)  
Старый 25.03.2011, 13:12
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

lalala,
1.Атрибут name не входит в число стандартно поддерживаемых атрибутов тега span
2.Да
Ответить с цитированием
  #6 (permalink)  
Старый 25.03.2011, 13:19
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

lalala,
P.S. без !DOCTYPE ваш пример в Internet Explorer для span не сработает.
Ответить с цитированием
  #7 (permalink)  
Старый 25.03.2011, 13:47
Аспирант
Отправить личное сообщение для lalala Посмотреть профиль Найти все сообщения от lalala
 
Регистрация: 04.03.2011
Сообщений: 87

Сообщение от рони
1.Атрибут name не входит в число стандартно поддерживаемых атрибутов тега span
не знал
рони, спасибо за объяснение
Ответить с цитированием
  #8 (permalink)  
Старый 25.03.2011, 14:40
Аватар для Avron2
Интересующийся
Отправить личное сообщение для Avron2 Посмотреть профиль Найти все сообщения от Avron2
 
Регистрация: 25.03.2011
Сообщений: 26

Может вы не поняли мой вопрос?
Вы не правильно поняли мой вопрос.
Я пишу обработчик события на изменение чекбокса
$('.cbTheme').change(function()  {
        var id =$(this).attr('id'); 
        select_color_tr(id); /*Красим соответствующую. строку таблицы*/
    });


Есть у меня ссылочка "Выделить все". В обработчике щелчка мыши на ней, ставятся все галочки. Почему соотвествующие строчки не окрашиваются? Получается событие
('.cbTheme').change(function()
наступает только если изменение сделано мышкой, а если я установил галочки своим скриптом, то событие не срабатывает? Получается, что мне нужно вызывать скрипт окраски строк и при щелчке на чекбоксе, и на "Выделить все". А я хочу при щелчке на выделить все, только поставить галочки, а чтобы на это событие происходила окраска соотвествующих строкы. Как сделать чтобы любое изменение галочки вызывало скрипт.

Последний раз редактировалось Avron2, 25.03.2011 в 14:43.
Ответить с цитированием
  #9 (permalink)  
Старый 25.03.2011, 15:26
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Avron2,
Так? )))
<html>
	<head>
		<script type='text/javascript' src='http://code.jquery.com/jquery-1.5.1.min.js'>
		</script>
		<style type="text/css">
		.style1{
			background:yellow;
		}
		</style>
	</head>
	<body>
	<div>
	<span>
		выделить все /
	</span><span>
		отменить все
	</span><br>
	<input type="checkbox"  class="change" id="n1"/>
	<br><br>
	<span id="text_n1">
		лалалалалалалалалала
	</span>
    <br />
    <input type="checkbox"  class="change" id="n2"/>
	<br><br>
	<span id="text_n2">
		лалалалалалалалалала
	</span>
    <br>

    </div>
	<script type='text/javascript'>
$('.change:input').change(function () {
    var id = "#text_" + $(this).attr('id')
    $(this).attr('checked') ? $(id).addClass('style1') : $(id).removeClass('style1');

});

$('span').click(function () {
    $('.change:input').attr('checked', !$(this).index()).change()
})
	</script>
	</body>
</html>
Ответить с цитированием
  #10 (permalink)  
Старый 25.03.2011, 15:34
Аватар для Avron2
Интересующийся
Отправить личное сообщение для Avron2 Посмотреть профиль Найти все сообщения от Avron2
 
Регистрация: 25.03.2011
Сообщений: 26

Спасибо. Жаль, но поставив галочку программно, мы автоматом не вызовем событие change() этой галочки не явно. Так ведь?

Последний раз редактировалось Avron2, 25.03.2011 в 18:27.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как заставить событие сработать один раз GRean Javascript под браузер 4 07.06.2010 00:29
Как назначить событие html-элементу? Jony X Общие вопросы Javascript 15 15.09.2009 20:55
Как повесить событие без редактирования файла? bilbas Общие вопросы Javascript 8 11.09.2009 15:17
Как программно вызвать событие Jeka09 Events/DOM/Window 16 31.03.2009 14:26
Как правильно обработать событие? BAnder Events/DOM/Window 19 03.02.2009 14:09