Скрипт работает только с первым чекбоксом на странице

@Анар · Регистрация: 12.09.2015

Студворк — интернет-сервис помощи студентам

Всем привет! Есть скрипт:

JavaScript
1
2
3
4
5
6
7
8
9
jQuery(document).ready(function($) {
    var elem = $('input[sec-name="Томатный"]');
    elem.change(function() {
        var value = elem.prop("checked");
    if(value == true) {
        alert("eee");
    }
});
});

Он выводит алерт при нажатии на соответствующий чекбокс. Инпутов с "sec-name="Томатный"" два (т.е. на странице много дублированных инпутов), обратиться к ним по уникальному id нельзя, нужно именно исходя из названия (sec-name = содержание label). Проблема заключается в том, что скрипт работает при нажатии на первый чекбокс на странице с sec-name и не срабатывает при нажатии на второй. Как заставить работать этот скрипт со всеми соответствующими чекбоксами?

@Padonak · 31.03.2016, 20:37

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>123</title>
<script src="../jquery-latest.min.js"></script>
<script>
jQuery(document).ready(function($) {
    $('input[sec-name="Томатный"]').change(function(){
        var value = $(this).prop("checked");
    if(value) {
        alert($(this).val());
    }
});
});
</script>
</head>
<body>
<input type="checkbox" sec-name="Томатный" value="first" />
<input type="checkbox" sec-name="Томатный" value="second" />
</body>
</html>

Добавлено через 17 секунд

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>123</title>
<script src="../jquery-latest.min.js"></script>
<script>
jQuery(document).ready(function($) {
    $('input[sec-name="Томатный"]').change(function(){
        var value = $(this).prop("checked");
    if(value) {
        alert($(this).val());
    }
});
});
</script>
</head>
<body>
<input type="checkbox" sec-name="Томатный" value="first" />
<input type="checkbox" sec-name="Томатный" value="second" />
</body>
</html>

@Анар · 31.03.2016, 23:17 **[ТС]**

Padonak, спасибо, работает. Не могли бы вы подсказать ещё кое что. Т.к. на странице так же используется условная логика, один из чекбоксов помечен "disabled", как сделать проверку и на checked и, на disabled? Написал примерно следующее:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
jQuery(document).ready(function($) {
    $('input[sec-name="Томатный"]').change(function(){
        var value = $(this).prop("checked");
        var disvalue = $(this).is(":disabled");
    if(value == true) {
        alert("1");
    }
    else if(value == false || disvalue == true) {
        alert("2");
    }
});
});

Но не работает. Пробовал выводить disvalue на страницу, $(this).is(":disabled") всегда false. Пробовал prop() и arrt(), они вообще ничего не возвращают.

@Padonak · 31.03.2016, 23:55

Если чекбокс disabled, то вы не сможете его изменить и onchange не произойдет. Для чего тогда проверка?

@Анар · 01.04.2016, 01:03 **[ТС]**

Padonak, вот, чтобы легче было понять. Первые два элемента это радио-кнопки, всё остальное - чекбоксы. Но чекбоксов на странице по два каждого, один набор для 30см, второй для 40см. Условной логикой они переключаются при выборе одного из диаметров, одни становятся видимыми и активными, вторые скрыты и disabled.
Проблема возникает когда выбран какой-либо чекбокс, что вызывает появление изображения ингредиента (сейчас есть только у "Томатный") и если после этого поменять "размер коржа", то чекбокс становится и disabled, и checked и изображение не убирается, поскольку условия скрипта этого не подразумевают. И получается, что как бы собираешь заново, ингредиенты не выбраны, а на изображении они есть.

UPD. Вот сейчас подумал, что можно бы написать скрипт для радиокнопок, чтобы при смене диаметра все чекбоксы просто бы сбрасывались...

Добавлено через 16 минут
По последней мысли, сделал примерно следующее:

JavaScript
1
2
3
4
5
jQuery(document).ready(function($) {
    $('input[name="tmcp_radio_0"]').change(function(){
        $('input.tmcp-checkbox').prop("checked", false);
});
});

Но сработает немного не так, как я мог подумать. "Галочки" скрипт снимает, но остальные элементы (которые отключаются скриптом) это unchecked не видят. Изображении так и остаётся, так ещё в добавок и инпуты для выбора количества не пропадают.

@Padonak · 01.04.2016, 09:51

А не пробовали не просто снимать checked с отмеченных чекбоксов а сымитировать по ним клик? Вдруг прокатит? )) Что-то типа

PHP/HTML
1
2
3
4
5
jQuery(document).ready(function($) {
    $('input[name="tmcp_radio_0"]').change(function(){
        $('input.tmcp-checkbox:checked').each(function(){$(this).click();});
});
});

п.с. блин, от вашего сайта жрать захотелось

сайт кайфовый!

@Анар · 01.04.2016, 13:18 **[ТС]**

Padonak, я бы попробовал, если бы умел

Работает! Спасибо!

@Padonak · 01.04.2016, 15:15

Ну и отлично )

@AlexCar · 30.08.2016, 07:22

Добрый день! данный пример успешно включил вывод $.getJSON,
но
при снятии галочки, действие не отменяется - выведенная информация так и "висит" на странице. не подскажете как доработать?

Добавлено через 31 секунду

JavaScript
1
2
3
4
5
6
7
8
9
10
<script>
jQuery(document).ready(function($) {
    $('input[sec-name="Томатный"]').change(function(){
        var value = $(this).prop("checked");
    if(value) {
        alert($(this).val());
    }
});
});
</script>

Добавлено через 3 минуты
Поясню: мой пример выглядит так:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
jQuery(document).ready(function($) {
    $('input[name="agzs"]').change(function(){
        var value = $(this).prop("checked");
    if(value) {
        
$.getJSON("marker-layout.php", 
  function(data) {
    for (var i = 0; i < data.length; i++) {
       window.myObjects = ymaps.geoQuery({ 
           
            type: "FeatureCollection",
            features: [{
                type: 'Feature',
                geometry: {
                    type: 'Point',
                    coordinates: data[i].geolocation.split(/\s*,\s*/)
                },
                options: {
                    preset: 'islands#darkBlueDotIconWithCaption'
                },
                properties: {
                    iconCaption: 'АГЗС',
                    balloonContentHeader: data[i].name,
                    balloonContentBody: data[i].meta_keyword + '</br>' + data[i].model,
                    balloonContentFooter: '<a href="http://...." />Подробнее>>> </a>'
                }
            }]
        }).addToMap(myMap);
    }
});  
 }
});
});

Новые блоги и статьи Все статьи Все блоги /
Символьное дифференцирование igorrr37 13.02.2026 / * Логарифм записывается как: (x-2)log(x^2+2) - означает логарифм (x^2+2) по основанию (x-2). Унарный минус обозначается как ! */ #include <iostream> #include <stack> #include <cctype>. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .

Скрипт работает только с первым чекбоксом на странице

Решение

Решение

@Padonak Философ-разговорник 1066 / 391 / 120 Регистрация: 20.02.2016 Сообщений: 884 Записей в блоге: 1
	31.03.2016, 23:55
	Если чекбокс disabled, то вы не сможете его изменить и onchange не произойдет. Для чего тогда проверка? 0

@Анар 225 / 216 / 89 Регистрация: 12.09.2015 Сообщений: 986
	01.04.2016, 13:18 [ТС]
	Padonak, я бы попробовал, если бы умел Работает! Спасибо! 1

@Padonak Философ-разговорник 1066 / 391 / 120 Регистрация: 20.02.2016 Сообщений: 884 Записей в блоге: 1
	01.04.2016, 15:15
	Ну и отлично ) 0