fadeIn и fadeOut divs на основе переключателя с условиями, если условия

Question

Я очень ценю вашу помощь заранее. Может кто-нибудь помочь мне выяснить, почему мой последний, если заявление не работает?

Я получаю сообщение об ошибке «Uncaught TypeError: Невозможно прочитать свойство» проверено «null» в консоли, но только для последнего else if.

//html for radio buttons 
<p><input type="radio" name="radio" value="generalPurpose" id="gp-toggle"><label for="gp-toggle" >General Purpose</label></p> 
<p><input type="radio" name="radio" value="client" id="cc-toggle-one"><label for="cc-toggle-one">Client</label></p> 
<p><input type="radio" name="radio" value="contractor" id="cc-toggle-contractor"><label for="cc-toggle-contractor">Contractor</label></p> 
<p><input type="radio" name="radio" value="urgent" id="urgent-toggle"><label for="urgent-toggle">Urgent Request</label></p> 

.

///js 
     $(function() { 
     $("#contact-form .button").click(function() { 
      var data = { 
      radio: $("input:radio[name=radio]:checked").val(), 
      firstName: $("#f-name").val(), 
      lastName: $("#l-name").val(), 
      email: $("#email").val(), 
      phone: $("#phone").val(), 
      comments: $("#comments").val(), 
      coverage: $("#coverage").val(), 
      services: $("#services-two").val(), 
      covered: $("#covered").val(), 
      provided: $("#provided").val(), 
      reason: $("#reason").val() 
     }; 

     $.ajax({ 
      type: "POST", 
      url: "formmail.php", 
      data: data, 
      success: function() { 
       $('.form-inner').fadeOut(1000); 
       setTimeout(function() { 
        if (document.getElementById('gp-toggle').checked) { 
         $('.gp-reply').fadeIn(1000); 
        } else if (document.getElementById('cc-toggle-one').checked) { 
         $('.client-reply').fadeIn(1000); 
        } else if (document.getElementById('cc-toggle-two').checked) { 
         $('.contractor-reply').fadeIn(1000); 
        } else if (document.getElementById('urgent-toggle').checked) { 
         console.log('perform fadein'); 
         $('.urgent-reply').fadeIn(1000); 
        } 
       }, 1200); 
      } 
     }); 
     return false; 
    }); 
}); 

еще раз спасибо. Я действительно надеялся на глупую опечатку; но я думаю, мне нужно будет больше поработать над этим.

поэтому на основе этого вопроса здесь >>Uncaught TypeError: Cannot read property 'checked' of null index.html:24, предложенный https://stackoverflow.com/users/1421098/ameya-rote Я сделал некоторые переменные и, похоже, сейчас работает нормально.

 var gp = document.getElementById('gp-toggle').checked; 
     var client = document.getElementById('cc-toggle-one').checked; 
     var contractor = document.getElementById('cc-toggle-contractor').checked; 
     var urgent = document.getElementById('urgent-toggle').checked; 

.

$(document).ready(function() { 
    $(function() { 
    $("#contact-form .button").click(function() { 
     var data = { 
      radio: $("input:radio[name=radio]:checked").val(), 
      firstName: $("#f-name").val(), 
      lastName: $("#l-name").val(), 
      email: $("#email").val(), 
      phone: $("#phone").val(), 
      comments: $("#comments").val(), 
      coverage: $("#coverage").val(), 
      services: $("#services-two").val(), 
      covered: $("#covered").val(), 
      provided: $("#provided").val(), 
      reason: $("#reason").val() 
     }; 


     $.ajax({ 
      type: "POST", 
      url: "formmail.php", 
      data: data, 
      success: function() { 
       $('.form-inner').fadeOut(1000); 
       setTimeout(function() { 
        if ('gp') { 
         $('.gp-reply').fadeIn(1000); 
        } else if ('client') { 
         $('.client-reply').fadeIn(1000); 
        } else if ('contractor') { 
         $('.contractor-reply').fadeIn(1000); 
        } else if ('urgent') { 
         console.log('perform fadein'); 
         $('.urgent-reply').fadeIn(1000); 
        } 
       }, 1200); 
      } 
     }); 
     return false; 
    }); 
    }); 
}); 

Answer 1

Попробуйте приведенный ниже код, надеюсь, он сработает.

function get_checked_val() { 
    var inputs = document.getElementsByName("selected"); 
    for (var i = 0; i < inputs.length; i++) { 
     if (inputs[i].checked) { 
     return inputs[i].value; 
     } 
    } 
} 

function onSubmit() { 
    var id = get_checked_val(); 
    alert("selected input is: " + id); 
} 

Или вы можете попробовать это сделать значение проверяется

$(document.getElementById('cc-toggle-one')).attr('checked', true);