jQuery单选按钮-仅选择一个? [英] jQuery radio buttons - choose only one?

问题描述

这可能是一个愚蠢的简单问题，但我被困住了.

This is probably a stupidly simple question, but I'm stuck.

我创建了一个包含多个复选框的表单，当单击复选框时，它将把每个复选框的值作为逗号分隔的列表传递给隐藏的输入字段.它奏效了.但是由于某些问题，我现在必须更改代码，以使其改为使用单选按钮-从而避免使用逗号分隔的值列表，一次只能列出一个.

I had created a form with multiple checkboxes, and when the checkboxes were clicked, it would pass the values of each checkbox as a comma-separated list to a hidden input field. It worked a treat. but due to some issues, I now have to alter my code so that it uses radio buttons instead - so no comma-separated list of values, just one at a time.

我更改了代码以将其换出为单选按钮，并且 except 在两方面都可以正常工作:1)它不会在单选按钮之间切换(每次我选择一个按钮时，它都会保持选中状态)当我选择其他选项时)和2)它会添加到列表中，而不是返回所选的单个选项.换句话说，它仍然像复选框一样工作，除了在视觉上，它是圆形的而且有一个点.哈哈

I altered the code to swap it out to radio buttons, and it's working fine except for two things: 1) it's not switching between radio buttons (each time I select a button, it stays selected as I choose others) and 2) it's adding to the list instead of returning the single option selected. In other words, it's still acting like a checkbox, except visually, it's round and has a dot. LOL

到目前为止，这是我的代码:

This is my code thus far:

jQuery(document).ready(function($) {
        $(':radio').click(function() { 
          var radio = $(this);
          var text = $('input[name="cat"]');
          if(radio.is(':checked')) {
            text.val(text.val() + radio.val());
            //alert(text.val());
          } else {
            text.val(function() {  
                $(this).val().replace(radio.val(),"");
            });
          }
        });
    });

因此，当我取消注释该警报"行时，我可以看到已传递的内容，它只是添加到列表中，而不是替换为新值.任何人都知道如何解决上述问题，以便只能选择并传递 one 选项吗? (尽管上面的代码非常棒可以作为复选框使用.我实际上认为我从这里某处获得了上面的代码，尽管我不记得在哪里！)

so when I uncomment that "alert" line, I can see what's passed, and it's just adding to the list instead of replacing with the new value. Anyone know how to fix the above so only one option can be selected and passed? (The above code works awesomely as a checkbox thing though. I actually think I got the above code from here somewhere, although I can't remember where!)

这是解决了这个问题并可以治疗的代码(感谢大家:))-也许将来会帮助别人.

here's the code that solved the issue and works a treat (thanks to you all :) ) - maybe it'll help someone else in the future.

`jQuery(document).ready(function($) {
        $(':radio').change(function() { 
          var radio = $(this);
          var text = $('input[name="cat"]');
          if(radio.is(':checked')) {
            text.val(radio.val());
            //alert(text.val());
          } else {
            text.val(function() {  
                $(this).val().replace(radio.val(),"");
            });
          }
        });
    });`

推荐答案

这是做同一件事的更简单方法:假设无线电组名称= a

This is the simpler way to do the same thing: Assuming the radio group name = a

$("input[name='a']").change(function(){
    alert($(this).val());
});

对于演示: http://jsfiddle.net/naveed_ahmad/AtrXw/

这篇关于jQuery单选按钮-仅选择一个?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！