fadeIn和淡入淡出基於單選按鈕，如果條件

Question

我真的很感激你的幫助提前。有人可以幫我弄清楚爲什麼我的最後一條if語句不起作用嗎？

我得到一個錯誤「Uncaught TypeError：無法讀取屬性'檢查'空'在控制檯，但只爲最後其他如果。

//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);