获取单选按钮之前的状态点击事件/如果之前选中则取消选择单选按钮

4

如何在click事件中查看单选按钮是否已经被选中?

实际上,我想做的是,如果之前点击过的单选按钮已经被选中,并且用户再次点击相同的单选按钮,则取消选中。

但下面的代码总是将if条件评估为true :P

$('input.radiooption').click(function(g) {
    if ($(this).is(":checked")) {
        console.log("already checked, now uncheck it");
    } else {
        console.log("Not checked");
    }
});

P.S.

问题是,当我点击一个未选中的单选按钮时,它会变为已选中

当我点击一个已选中的按钮时,它仍然是已选中状态

因此,我想知道在click事件中确定单选按钮的先前状态的方法。

JS FIDDLE


1
这是 radio 的默认行为。 - Tushar
1
@Tushar - 直到你点击另一个单选按钮它才会改变。 - Sudharsan S
你确定需要单选按钮而不是复选框吗? - Grundy
2
@Umair,你有点混淆了。单选按钮本来就是必选项。它们的替代品是复选框(可以选择性使用)。但如果你故意不想使用复选框,那么很难管理它。在stackoverflow上有很多相关资源。 - Manoz
@Umair 请看下面我的回答 - Tushar
显示剩余4条评论
2个回答

4

使用临时变量跟踪先前的状态:

var prv;
var markIt = function(e) {
  if (prv === this && this.checked) {
    this.checked = false;
    prv = null; //allow seemless selection for the same radio
  } else {
    prv = this;
  }
};
$(function() {
  $('input.radiooption').on('click', markIt);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input type='radio' name='group' class='radiooption' />
<input type='radio' name='group' class='radiooption' />
<input type='radio' name='group' class='radiooption' />
<input type='radio' name='group' class='radiooption' />
<input type='radio' name='group' class='radiooption' />


0

请看这里:

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'));
    });
};

这是一个完整的例子:http://jsfiddle.net/EtNXP/1467/


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接