单选按钮检查事件处理

Posted 2023-03-05

【中文标题】单选按钮检查事件处理

【英文标题】：Radio button checked event handling

【发布时间】：2011-02-13 11:29:17

【问题描述】：

In my application, I need a radio group, in which whenever a radio-button is checked, an alert occur so that I can post it's value to ajax post with jQuery.

你能帮我吗，请问我如何在 jQuery 中做到这一点？

【参考方案1】：

你可以简单地使用JQuery的change方法来获取当前单选的值，代码如下：

$(document).on('change', '[type="radio"]', function() 
    var currentlyValue = $(this).val(); // Get the radio checked value
        
    alert('Currently value: '+currentlyValue); // Show a alert with the current value
);

您可以将选择器 '[type="radio"]' 更改为您想要的类或 ID。

【参考方案2】：

$(document).on('change','.radio-button', function()

    const radio = $(this);

    if (radio.is(':checked')) 
      console.log(radio)
    

);

【参考方案3】：

$("#expires1").click(function()
     if (this.checked)
        alert("testing....");
);

【讨论】：

尽管这可能是正确的，但没有解释为什么它是答案，它不会教任何东西。对于超过 8 年的问题，这根本没有帮助。

【参考方案4】：

2017 年更新：嘿。这是一个可怕的答案。不要使用它。在过去，这种类型的 jQuery 使用很常见。它可能在当时有效。只需阅读它，意识到它很糟糕，然后继续（或投反对票或其他任何方式）对今天的 jQuery 更好的其他答案之一。

---

$("input[type=radio]").change(function()
    alert( $("input[type=radio][name="+ this.name + "]").val() );
);

【讨论】：

你能做到$(this).val()吗？

我花了一段时间才明白$("input[type=radio][name="+ this.name + "]").val() 在这里做什么。您能否编辑您的帖子并将其更改为alert( $(this).val() ); 我想这是投反对票的原因。

@Applejack ：不要更改正确的内容，只需添加另一个内容。这是比alert( $(this).val() );

更好的答案

$.change() 在取消选中收音机时不会调用。这个功能真的是onCheck。

同意苹果杰克，答案应该改变（或者因为它是错误的而被遗忘;-)）。请参阅：plnkr.co/edit/563jmzFvukpqHlA0HnvC?p=preview。它会在检查更改发生时触发，但始终会产生相同的值。

【参考方案5】：

html 代码：

<input type="radio" name="theName" value="1" id="option-1">
<input type="radio" name="theName" value="2">
<input type="radio" name="theName" value="3">

javascript 代码：

$(document).ready(function()
    $('input[name="theName"]').change(function()
        if($('#option-1').prop('checked'))
            alert('Option 1 is checked!');
        else
            alert('Option 1 is unchecked!');
        
    );
);

在名称为“theName”的多个收音机中，检测选项 1 何时被选中或未选中。适用于所有情况：点击控制、使用键盘、使用操纵杆、自动更改其他动态功能的值等。

【参考方案6】：

试试这样的：

$(function()
  $('input[type="radio"]').click(function()
    if ($(this).is(':checked'))
    
      alert($(this).val());
    
  );
);

如果你给你的单选按钮一个类，那么你可以用$('.someclass')替换代码$('input[type="radio"]')。

【讨论】：

@David Murdoch：没错，不过你可以使用change。

$.click() 在使用键盘或其他控件操作表单控件时不会调用。点击功能并非在所有情况下都有效。