Подскажите пожалуйста как правильно сделать Есть два radio и под каждым из них свой список select. Если активный первый radio то второй select неактивный , если второй radio активный то первый select не активный. Ни как не могу добиться правильной работы. Либо не переключается либо один из списков не становится активным
@sokol86922, в таких случаях показывают HTML-код, относящийся к задаче. Вариант jQuery Код (Javascript): const sel = $('select'); $(':radio').on('change', function() { let curSel = $(this).next('select'); curSel.prop('disabled', false); sel.not(curSel).prop('disabled', true); }); Нативный JS Код (Javascript): const sel = [].slice.call(document.querySelectorAll('select')); [].forEach.call(document.querySelectorAll('[type=radio]'), (el) => { el.addEventListener('change', function() { let curSel = this.nextElementSibling; curSel.disabled = false; sel.filter(s => s !== curSel)[0].disabled = true; }); }); --- Добавлено --- P.S. Вместо метода .call(), можно использовать Array.from().
Спасибо но тоже как то не корректно работает включается, но не переключается между первым и вторым я наверно что то не так делаю подскажите плиз вот структура формы HTML: <form name="form1" action="#" method="post"> <input name="Name1" type="radio" value="" checked> <select size="1" name="select1"> <option value="value1">Item1</option> </select> <input name="Name1" type="radio" value="" > <select size="1" name="select2"> <option value="value2">Item2</option> </select> <input type="submit" value="Send"> </form>
@sokol86922, в первую очередь, нужно смотреть в консоль, т.к. возможно, что вам там кричат об ошибках, а вы их не видите. Пробуйте такой вариант Код (Javascript): const form = document.querySelector('form[name=form1]'), rad = Array.from(form.querySelectorAll('input[name=Name1]')), sel = Array.from(form.querySelectorAll('select[name^=select]')); rad.forEach((el, i) => { el.addEventListener('change', function() { let indx = rad.indexOf(this); sel.forEach((s, i) => { s.disabled = i !== indx; }); }); sel[i].disabled = !el.checked; });
@Deonis Можно рассказать про [].slice.call? У меня от этого вообще мозг зависает, не понимаю, как работает. Если просто так сделать sel2 = document.querySelectorAll('select') то будет NodeList, а с [].slice.call массив и как понимать, когда это надо применять? Или это надо делать, когда из NodeList надо преобразовать массив?
Именно так. Когда в этом есть необходимость или для удобства. Не вижу смысла пересказывать то, что уже написано, при чем не один раз --- Добавлено --- Не переживайте. От JS мозг виснет не только у новичков
Спасибо работает. У меня две были ошибки нужно было сразу в форму обернуть и был подключен сss бутсреп не хотел работать верно. отключил все заработало .