jquery - 同时使用 jQuery .find() 和多个条件？

Question

我知道还有其他方法可以获取单选按钮值，但我想知道如何使用 .find() 来做到这一点。

我只想记录所选单选按钮的值，因此需要同时通过两个条件查找:

带有name=area的按钮

带有selected=selected的按钮

<div class="radio">
  <label>
    <input class="track-order-change" type="radio" name="area" id="area1" value="area1" checked="checked">
    Area 1
  </label>
</div>
<div class="radio">
  <label>
    <input class="track-order-change" type="radio" name="area" id="area2" value="area2">
    Area 2
  </label>
</div>
<div class="radio">
  <label>
    <input class="track-order-change" type="radio" name="area" id="area3" value="area3">
    Area 3
  </label>
</div>

当 track-order-change 类的任何内容发生更改时，它将运行 UpdateOrderSubmission 函数。

$('.track-order-change').on('change', function() { updateOrderSubmission() });

我想要 updateOrderSubmission 函数来控制台记录所选单选按钮的值。

   var updateOrderSubmission = function() {
     var orderSubmission = {
       area: $('#submit-initial-form').find('[name=area],[checked=checked]').this.val()
     }
     console.log(orderSubmission)
   };

上面的代码不起作用。如何获取所选单选按钮的值？我需要使用两个条件(名称和选中)来执行 .find()，而不仅仅是一个条件。

更新

那么为什么 $('#submit-initial-form').find('[name=area][checked=checked]').val(); 不起作用？它说“获取 submit-initial-form ID 并找到具有 name=area 和 checked=checked 的子元素并返回其值。

只有 $('#submit-initial-form').find(':radio[name=area]:checked').val() 有效。为什么必须指定它是单选按钮？

Answer 1

我认为，您可能需要使用:checked选择器

var updateOrderSubmission = function () {
    var orderSubmission = {
        area: $('#submit-initial-form').find('input[name=area]:checked').val()
    }
    console.log(orderSubmission)
};

演示:Fiddle