Radio Button: change z index

Question

Что я пытаюсь сделать, так это сделать так, чтобы при выборе переключателя z-индекс выбранного изображения сразу же менялся на самое высокое значение. У меня 6 изображений, уложенных друг на друга. Каждый радиокнопка связан с одним из изображений. Зритель должен видеть изображение, когда выбран соответствующий переключатель. «Имя» каждого переключателя - «выбор». Я попытался это, но он не работает:

`

   <div class="radio"><label><input type="radio" value="2" name="selection">Bouquet with Chocolate</label></div> 
       <div class="radio"><label><input type="radio" value="3" name="selection">with Clear Vase</label></div> 
       <div class="radio"><label><input type="radio" value="4" name="selection">with Clear Vase & Chocolate</label></div> 
       <div class="radio"><label><input type="radio" value="5" name="selection">with Red Vase</label></div> 
       <div class="radio"><label><input type="radio" value="6" name="selection">with Red Vase & Chocolate</label></div> 

$(document).ready(function(){ 
      $('input:[type=radio][name=selection]').change(function(){ 
       if (this.value == '1'){ 
        document.getElementById('image_1').style.zIndex = "2"; 
       } 
       else if (this.value == '2'){ 
        document.getElementById('image_2').style.zIndex = "2"; 
       } 
       else if (this.value == '3'){ 
        document.getElementById('image_3').style.zIndex = "2"; 
       } 
       else if (this.value == '4'){ 
        document.getElementById('image_4').style.zIndex = "2"; 
       } 
       else if (this.value == '5'){ 
        document.getElementById('image_5').style.zIndex = "2"; 
       } 
       else (this.value == '6'){ 
        document.getElementById('image_6').style.zIndex = "2"; 
       } 
      }); 
     }); 

`

Answer 1

Ваш входной селектор и если/иначе функция неверны.

1. Ваш селектор не нужно иметь двоеточие между входом и типа

   input:[type=radio][name=selection]

2. Для того, если/еще функции, последний случай else не должно быть условием назначен. Если вам нужно определить окончательное условие, а не охватывать все остальные случаи, закончите с else if.

   else (this.value == '6'){ document.getElementById('image_6').style.zIndex = "2"; }

Правильный код должен выглядеть следующим образом:

$('input[type=radio][name=selection]').change(function(){ 
     if (this.value == '1'){ 
     document.getElementById('image_1').style.zIndex = "2"; 
     } 
     else if (this.value == '2'){ 
     document.getElementById('image_2').style.zIndex = "2"; 
     } 
     else if (this.value == '3'){ 
     document.getElementById('image_3').style.zIndex = "2"; 
     } 
     else if (this.value == '4'){ 
     document.getElementById('image_4').style.zIndex = "2"; 
     } 
     else if (this.value == '5'){ 
     document.getElementById('image_5').style.zIndex = "2"; 
     } 
     else if (this.value == '6'){ 
     document.getElementById('image_6').style.zIndex = "2"; 
     } 
    });