jQuery检查/取消选中单选按钮onclick [英] jQuery check/uncheck radio button onclick

问题描述

我有这个代码来检查/取消选中一个单选按钮。

I have this code to check/uncheck a radio button onclick.

我知道这对UI不好，但我需要这个。

I know it is not good for the UI, but I need this.

$('#radioinstant').click(function() {     
  var checked = $(this).attr('checked', true);
  if(checked){ 
    $(this).attr('checked', false);
  }
  else{ 
    $(this).attr('checked', true);
  }
});

上述功能不起作用。

如果我点击按钮，则没有任何变化。它仍然是检查。为什么？错误在哪里？我不是jQuery专家。我在jQuery 1.3.2上

If I click on the button, nothing changes. It remain checked. Why? Where is the error? I am not a jQuery expert. I am on jQuery 1.3.2

为了清楚 #radioinstant 是单选按钮的ID。 / p>

Just to be clear #radioinstant is the ID of the radio button.

推荐答案

如果你想做的就是有一个检查的复选框，不要担心用JQuery做这件事。这是点击复选框的默认功能。但是，如果您想要执行其他操作，可以使用JQuery添加它们。在jQuery 1.9之前，您可以使用 $（this）.attr（'checked'）; 来获取值而不是 $（this） .attr（'checked'，true）; ，因为第二个将设置值。

If all you want to do is have a checkbox that checks, don't worry about doing it with JQuery. That is default functionality of a checkbox on click. However, if you want to do additional things, you can add them with JQuery. Prior to jQuery 1.9, you can use use $(this).attr('checked'); to get the value instead of $(this).attr('checked', true);, as the second will set the value.

这里是一个小提示演示显示默认复选框功能与您使用JQuery执行的操作。

Here is a fiddle demonstration that shows the default checkbox functionality vs. what you are doing with JQuery.

注意：在JQuery 1.6之后，你应该使用 $（this）.prop; 而不是 $（this）.attr 在所有三个地方（感谢@Whatevo指出这一点并且详情请见）。

Note: After JQuery 1.6, you should use $(this).prop; instead of $(this).attr in all three places (thanks @Whatevo for pointing this out and see here for further details).

更新：

抱歉，错过了它的要求成为一个单选按钮。您仍然可以考虑使用该复选框，但此处是无线电输入版本的更新代码。它的工作原理是将 previousValue 设置为复选框上的属性，因为我认为1.3中不支持 prop 0.2。您也可以在范围变量中执行此操作，因为有些人不喜欢在字段上设置随机属性。 此处是新示例。

Sorry, missed the requirement that it had to be a radio button. You still may want to consider the checkbox, but here is the updated code for the radio input version. It works by setting the previousValue as an attribute on the checkbox, as I don't think prop is supported in 1.3.2. You could also do this in a scoped variable, as some people don't like setting random attributes on fields. Here is the new example.

更新2：

正如Josh指出的那样，之前的解决方案仅适用于一个单选按钮。这是一个功能，使一组无线电可以通过其名称取消选择，并小提琴：

As Josh pointed out, the previous solution only worked with one radio button. Here's a function that makes a group of radios deselectable by their name, and a fiddle:

var makeRadiosDeselectableByName = function(name){
    $('input[name=' + name + ']').click(function() {
        if($(this).attr('previousValue') == 'true'){
            $(this).attr('checked', false)
        } else {
            $('input[name=' + name + ']').attr('previousValue', false);
        }

        $(this).attr('previousValue', $(this).attr('checked'));
    });
};

这篇关于jQuery检查/取消选中单选按钮onclick的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！