jquery无线电组选择器未更改值

我试图使用jQuery对单击我的单选按钮组做出反应。由于某些原因，它没有按预期工作。每次单击其中一个单选按钮，返回的值都是相同的，默认值为：美国邮政递送

以下是我的jquery：

var deliveryMethod = $('input[name="delivery-method"]');
deliveryMethod.click(function() {
    if(deliveryMethod.val() === "U.S. postal delivery") {
        console.log('yay!');
    }
});

以下是我的标记：

<div class="form-radios"><div class="form-item" id="edit-delivery-method-U.S.-postal-delivery-wrapper">
 <label class="option" for="edit-delivery-method-U.S.-postal-delivery"><input type="radio" id="edit-delivery-method-U.S.-postal-delivery" name="delivery-method" value="U.S. postal delivery"  checked="checked"  class="form-radio" /> U.S. postal delivery</label>
</div>
<div class="form-item" id="edit-delivery-method-Canadian-postal-delivery-wrapper">
<label class="option" for="edit-delivery-method-Canadian-postal-delivery"><input type="radio" id="edit-delivery-method-Canadian-postal-delivery" name="delivery-method" value="Canadian postal delivery"   class="form-radio" /> Canadian postal delivery</label>
</div>
<div class="form-item" id="edit-delivery-method-International-postal-delivery-wrapper">
<label class="option" for="edit-delivery-method-International-postal-delivery"><input type="radio" id="edit-delivery-method-International-postal-delivery" name="delivery-method" value="International postal delivery"   class="form-radio" /> International postal delivery</label>
</div>
<div class="form-item" id="edit-delivery-method-Digital-delivery-wrapper">
<label class="option" for="edit-delivery-method-Digital-delivery"><input type="radio" id="edit-delivery-method-Digital-delivery" name="delivery-method" value="Digital delivery"   class="form-radio" /> Digital delivery</label>

---

因为它返回一个元素数组，而您只检查第一项的值。在jquery中处理数组时，需要取$this的值，数组中触发单击函数的元素：

var deliveryMethod = $('input[name="delivery-method"]');
deliveryMethod.click(function() {
    if($(this).val() === "U.S. postal delivery") {
        console.log('yay!');
    }
});

---

因为它返回一个元素数组，而您只检查第一项的值。在jquery中处理数组时，需要取$this的值，数组中触发单击函数的元素：

var deliveryMethod = $('input[name="delivery-method"]');
deliveryMethod.click(function() {
    if($(this).val() === "U.S. postal delivery") {
        console.log('yay!');
    }
});

---

这是因为您有几个元素使用名称传递方法，所以当您执行第一个赋值时，您会得到一个元素数组，但是单击函数只在第一个元素上激发。这样写：

$('input[name="delivery-method"]').each(function() {

   $(this).click(function() {
    //do what you did here
   });
});

---

这是因为您有几个元素使用名称传递方法，所以当您执行第一个赋值时，您会得到一个元素数组，但是单击函数只在第一个元素上激发。这样写：

$('input[name="delivery-method"]').each(function() {

   $(this).click(function() {
    //do what you did here
   });
});

---

使用的getter版本时，如果调用它的jQuery对象包含多个DOM元素引用，.val将只返回集合中第一个元素的值。您只需要获取选中输入元素的值

监听复选框的更改事件可能更合适，因为如果已选中正在单击的复选框，它仍将调用您的功能

然后，您可以与伪选择器一起使用，仅返回选中的无线电输入并获取其值：

var deliveryMethod = $('input[name="delivery-method"]');
deliveryMethod.change(function() {
    if(deliveryMethod.filter(':checked').val() === "U.S. postal delivery") {
        console.log('yay!');
    }
});

---

使用的getter版本时，如果调用它的jQuery对象包含多个DOM元素引用，.val将只返回集合中第一个元素的值。您只需要获取选中输入元素的值

监听复选框的更改事件可能更合适，因为如果已选中正在单击的复选框，它仍将调用您的功能

然后，您可以与伪选择器一起使用，仅返回选中的无线电输入并获取其值：

var deliveryMethod = $('input[name="delivery-method"]');
deliveryMethod.change(function() {
    if(deliveryMethod.filter(':checked').val() === "U.S. postal delivery") {
        console.log('yay!');
    }
});

---

我很高兴我能帮上忙：我很高兴我能帮上忙：你能告诉我为什么像上面的@banana在他的帖子中所显示的那样，使用每一个都比不使用它更合适吗？它们是等价的吗？@user1015214分别迭代整个数组，将单击事件分配给每个输入，属性名作为传递方法。这与这里的其他答案基本相同，但我喜欢亲自使用，因为在其他地方它很方便。因此，我通过在任何地方使用object变量数组来保持代码的一致性。你能告诉我为什么使用每个数组比不使用它们更合适吗，正如上面@banana在他的帖子中所说的那样？它们是等价的吗？@user1015214分别迭代整个数组，将单击事件分配给每个输入，属性名作为传递方法。这与这里的其他答案基本相同，但我喜欢亲自使用，因为在其他地方它很方便。因此，我通过在任何有对象变量数组的地方使用来保持代码的一致性。您可以向我解释为什么这个答案也有效，而且更完整，因为它使用了“change”，而不需要像其他两个答案那样使用$this？相反，它获取当前拥有的jQuery对象，并使用伪选择器过滤掉当前选中的单选按钮。由于分组的单选按钮一次只能选中1个，因此只有一个匹配项。写入$this是一种较长的方法：p@Banana真的不是。“这两者并不等同。”乔治在他的剧本中是这样的。因为他捕捉单选按钮上的点击事件。如果他通过编程而不是单击来更改无线电值，你的方法会更合适。你能向我解释一下为什么这个答案也有效，而且更完整，因为它使用了“change”，而不像其他两个答案那样需要使用$this吗，它获取当前拥有的jQuery对象，并使用伪选择器过滤掉当前选中的单选按钮。由于分组的单选按钮一次只能选中1个，因此只有一个匹配项。写入$this是一种较长的方法：p@Banana真的不是。“这两者并不等同。”乔治在他的剧本中是这样的。因为他捕捉单选按钮上的点击事件。如果他通过编程而不是单击来更改无线电值，您的方式将更合适。