Question

单选按钮，默认情况下选中第一个：

  <div class="shipping">
    <div class="title">Select shipping method</div>
    <label><input type="radio" name="shipping" value="courier-dpd" checked="checked">Courier DPD</label>
    <label><input type="radio" name="shipping" value="personal">Personal pick up</label>
    <button>Next</button>
  </div>

Js：

$(document).on('click', '.shipping button', function() {
  let val = $('.shipping').find('input[name="shipping"]:checked').val()
  console.log(val);
}

即使我手动切换单选按钮并选择第二个单选按钮，jquery也会不断获取firts单选按钮的值，而与用户选择无关。

那是为什么？我找不到解决方法。

Answer 1

编辑2：从更新的问题中添加了JS代码。似乎在这里起作用。

编辑：添加了提交按钮以演示提交操作。

好吧，您更改值后会打电话给console.log吗？我在下面创建了一个代码段，效果很好。

$(function() {
  let val = $('.shipping').find('input[name="shipping"]:checked').val()
  console.log(val);

  /*$('#btn').on('click', function() {
    let val = $('.shipping').find('input[name="shipping"]:checked').val()
    console.log(val);
  })*/

  $(document).on('click', '.shipping button', function() {
    let val = $('.shipping').find('input[name="shipping"]:checked').val()
    console.log(val);
  })
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="shipping">
  <div class="title">Select shipping method</div>
  <label><input type="radio" name="shipping" value="courier-dpd" checked="checked">Courier DPD</label>
  <label><input type="radio" name="shipping" value="personal">Personal pick up</label>
  <button>Next</button>
</div>

如果默认选中，jQuery会不断获取错误的单选按钮的值

1 个答案: