JQuery 操作取决于选择的单选按钮 - if/else

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

本文关键字：if else 单选按钮 操作 取决于 选择 JQuery      更新时间：2023-09-26

我相信这应该很简单，我以为我正在做某事，但它就是不起作用。 原谅我，因为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();
}
相关文章：