取消选中单选按钮是错误的

Question

看看这个小提琴： http : //jsfiddle.net/5rmEe/

目标是取消选中用户单击时的单选按钮（如果已选中），然后选中它（如果未选中）

但随后看来，点击事件会触发两次，从而使检查/取消检查高度错误。

我尝试了

e.stopPropagation();
e.preventDefault();

命令，但每个命令都会导致不同的错误...

我将如何实现这一目标并相应地修复该代码？

Answer 1

我同意其他所有人的意见，认为复选框会更好。

但是，话虽如此，这可能对您有用。 首先，单选按钮上的checked属性将其标记为选中。 因此，要删除检查，您必须删除属性。 但是，单击单选按钮时，它想放回该属性。

我的解决方案实际上更像是黑客。 我正在添加另一个属性，并将其用作标记来确定是删除还是添加选中的属性。 HTH

$('input[type=radio]').each(function(){
  var input = $(this);
  input.click(function(e){
      if(input.attr('cval')==='1'){
          input.attr('cval', '0');
          input.removeAttr('checked');
      }
      else{
          input.attr('cval', '1');
          input.attr('checked', 'checked');
      }
  });
});​

Answer 2

为什么不只是将复选框设置为看起来像单选按钮一样。 这样一来，您可以充分利用两者的优势。 您正在按预期使用复选框，而您的老板仍然不会有任何线索；）

http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/

如果您开始搜索此概念，那么这里有很多示例。 您将要在这里做相反的操作，但示例相同。

您可以将html单选按钮设置为看起来像复选框的样式吗？

Answer 3

您需要一个复选框-这就是它们的用途。 满足用户对标准控件的行为的期望是一个坏主意。