无法使用 jQuery 从单选表单字段中获取值

Question

我正在尝试制作电子商务网站以进行实践，并希望从 Radio 表单字段中获取值，无论买家是想支付货到付款还是想使用 PayPal 付款。我想获取表单字段值，这样，如果它的 COD，我只向用户显示“已下订单”，但如果它的贝宝，我重定向到支付网关。

下面是我的代码

<div class="form-check">

    <input type="radio" name="paymentmode" id="cod" class="form-check-input" value="cod">

    <label for="cod">Cash on Delivery</label>   

    <input type="radio" name="paymentmode" id="paypal" class="form-check-input" value="paypal">

    <label for="paypal">PayPal</label>

</div>

JS代码如下

<script>

    var radio = $("input[name='paymentmode']:checked").val();

    var button = $('.theButton');

    button.click(function() {

        alert(radio);

    });

</script>

每当我单击按钮时，都会显示警报，但它显示“未定义”而不是单选字段中的值。请帮我

编辑：我试图获取一些其他值，例如姓名或地址，而警报框什么也没返回，它是一个空警报框

Answer 1

您的代码不起作用，因为您首先在变量中设置了值，并且每当单选按钮值更改时，它不会影响该变量，这就是您的代码无法按预期工作的原因。试试下面的工作代码 -$('.theButton').click(function() {&nbsp; console.log($("input[name=paymentmode]:checked").val());});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><div class="form-check">&nbsp; <input type="radio" name="paymentmode" id="cod" class="form-check-input" value="cod">&nbsp; <label for="cod">Cash on Delivery</label>&nbsp; <input type="radio" name="paymentmode" id="paypal" class="form-check-input" value="paypal">&nbsp; <label for="paypal">PayPal</label>&nbsp; <button class='theButton'>Click It!</button></div>

Answer 2

当您单击按钮时，“收音机”将获取数据。<script>var radio;var button = $('.theButton');&nbsp; &nbsp; button.click(function() {&nbsp; &nbsp; &nbsp; &nbsp; radio = $("input[name='paymentmode']:checked").val();&nbsp; &nbsp; &nbsp; &nbsp; alert(radio);&nbsp; &nbsp; &nbsp; &nbsp; });</script>