簡體   English   中英

JQuery 動作取決於選擇了哪個單選按鈕 - if/else

[英]JQuery actions depending on which radio button is selected - if/else

我相信這應該很簡單,我認為我正在做某事,但它只是不起作用。 原諒我,因為 Javascript 不是我的強項。

我只希望主按鈕(獲取您的新費率)根據用戶對 3 個問題中的最后一個選擇“是”還是“否”(這些是樣式單選按鈕)來執行以下兩項操作之一。

在此先感謝您的時間!

這是正在進行的頁面: http : //atomcrayon.com/mediaforce/refinance_go_v3.1/go.html

<div class="radioSelection">
    <input type="radio" id="radioLicenseYes" name="radioLicense"><label for="radioLicenseYes" class="radioYes">YES</label>
    <input type="radio" id="radioLicenseNo" name="radioLicense"><label for="radioLicenseNo" class="radioNo">NO</label>
</div>

<button class="getRate">Get Your New Rate</button>

<script type='text/javascript'>
function CheckLicense() {
    var licenseYes = document.getElementById("radioLicenseYes");
    var licenseNo = document.getElementById("radioLicenseNo");
    if(licenseYes.checked) {
        $(".getRate").click(function() {
            $("#questions").fadeOut(500);
            $("#loadingAnim").delay(500).fadeIn(1).delay(7000).fadeOut(500);
            $("#loading1").delay(500).fadeIn(500).delay(1500).fadeOut(500);
            $("#loading2").delay(3000).fadeIn(500).delay(1500).fadeOut(500);
            $("#loading3").delay(5500).fadeIn(500).delay(1500).fadeOut(500);
            $("#qualify").delay(8000).fadeIn(500);
            $("#redirecting").delay(8800).fadeIn(1);
            $("#loadingAnim2").delay(8800).fadeIn(1);
        });
    }
    else if(licenseNo.checked) {
        $(".getRate").click(function() {
            $("#questions").fadeOut(500);
            $("#noQualify").delay(500).fadeIn(500);
        });
    }
}

這是一個工作示例:

 $(function() { $(".getRate").click(function() { var licenseYes = document.getElementById("radioLicenseYes"); var licenseNo = document.getElementById("radioLicenseNo"); if (licenseYes.checked) { console.log("yes hello"); } else if (licenseNo.checked) { console.log("no hello"); } }); });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="radioSelection"> <input type="radio" id="radioLicenseYes" name="radioLicense"><label for="radioLicenseYes" class="radioYes">YES</label> <input type="radio" id="radioLicenseNo" name="radioLicense"><label for="radioLicenseNo" class="radioNo">NO</label> </div> <button class="getRate">Get Your New Rate</button>

使用 jQuery,您可以輕松添加事件偵聽器並運行 if 語句。 您的代碼有什么問題:您創建了一個 javascript 函數,但從未調用過它! 在你的函數中,你有一些 jquery 可以很好地完成這個技巧(有一些修改)。 您不需要創建一個命名函數,例如: function getBla() jQuery 為您做到了這一點。 為了演示目的,我已經簡化了代碼。

嘗試:

function CheckLicense() {        
    if ($('input[name=radioLicense]:checked').length !=0 ) {
       if ($('input[name="radioLicense"]:checked').val() == "YES"){

        $(".getRate").click(function() {
            $("#questions").fadeOut(500);
            $("#loadingAnim").delay(500).fadeIn(1).delay(7000).fadeOut(500);
            $("#loading1").delay(500).fadeIn(500).delay(1500).fadeOut(500);
            $("#loading2").delay(3000).fadeIn(500).delay(1500).fadeOut(500);
            $("#loading3").delay(5500).fadeIn(500).delay(1500).fadeOut(500);
            $("#qualify").delay(8000).fadeIn(500);
            $("#redirecting").delay(8800).fadeIn(1);
            $("#loadingAnim2").delay(8800).fadeIn(1);
        });
    } else {
        $(".getRate").click(function() {
            $("#questions").fadeOut(500);
            $("#noQualify").delay(500).fadeIn(500);
        });
      }
    }
}

$('.getRate').click(function() {
     CheckLicense();
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM