Question

在我的应用程序的一部分中，我检查重复的无线电输入选择，如果已经选择了早期选择，则还原。

这是我的HTML代码..

<input type="radio" name="A" checked="checked" onclick="return check();" />
<input type="radio" name="A" onclick="return check();" />

<br />

<input type="radio" name="B"  onclick="return check();" />
<input type="radio" name="B" checked="checked" onclick="return check();" />

这是javascript代码

function check() {
    //logic to check for duplicate selection
    alert('Its already selected');
    return false;
}

这是demo 上面的代码工作正常。问题是最初检查输入的时间。在这种情况下，无线电输入选择不会恢复为未选中状态。

注意：处于选中状态时，返回false显示并发出警告，并将复选框设置为初始检查状态。但是，当最初处于非检查状态时，这不起作用。

Answer 1

在DOM ready中，检查是否选中了任何单选按钮。如果选中任何单选按钮，请将计数器增加1。在单击单选按钮时，检查计数器值是否为1.如果是，则返回false，否则将计数器增加1。

试试此代码，

<强> HTML

<input type="radio" name="A" checked="checked" />
<input type="radio" name="A" />
<br />
<input type="radio" name="B" />
<input type="radio" name="B" />

<强> JS

var counterA = 0;
var counterB = 0;
$(document).ready(function () {
    if ($("input:radio[name=A]").is(":checked") == true) counterA++;
    if ($("input:radio[name='B']").is(":checked") == true) counterB++;
});

$('input:radio[name=A]').click(function () {
    if (counterA == 1) {
        alert('already checked');
        return false;
    } else {
        counterA++;
    }
});
$('input:radio[name=B]').click(function () {
    if (counterB == 1) {
        alert('already checked');
        return false;
    } else {
        counterB++;
    }
});

查看DEMO

Answer 2

iJay想问几个问题并为每个问题提供相同的答案。每个答案只能选择一次。如果用户第二次点击相同的答案，则应显示错误消息。

// get all elements
var elements = document.querySelectorAll('input[type="radio"]');

/**
 * check if radio with own name is already selected
 * if so return false
 */
function check(){

  var selected_name = this.name,
      selected_value = this.value,
      is_valid = true;

  // compare with all other elements
  for(var j = 0; j < len; j++) {
      var el = elements[j];

      // does the elemenet have the same name AND is already selected?
      if(el.name != selected_name && el.value == selected_value && el.checked){
        // if so, selection is not valid anymore
          alert('Oups..! You can not select this answer a second time :( Choose another one!')

        // check current group for previous selection
        is_valid = false;
        break;
      }
  };

  return is_valid;
}

/**
 * bind your elements to the check-routine
 */
for(var i = 0, len = elements.length; i < len; i++) {
    elements[i].onmousedown = check;
}

这是DEMO

Answer 3

使用$yourRadio.prop('checked', false);取消选中特定的广播。

Answer 4

像这样使用：

function check() {
    //logic to check for duplicate selection
    var checked = true ? false : true;
    $(this).prop('checked', checked);
    return false;
}

Answer 5

1）将class属性添加到相同类型的复选框元素（具有相同名称）

   ex: class = "partyA"

2）
var sourceIdsArr = new Array（）;

function check() {
     $('.partyA').each(function() {
 var sourceId = $(this).val();
      if(sourceIdsArr.indexOf(sourceId) != -1){
         sourceIdsArr.push(sourceId );
      }
      else{
         alert('Its already selected');
         return false;
      }
   });

}

Answer 6

这是你的代码..

function check() {
        //logic to check for duplicate selection
 var selectflag=0;

 var radiovalue=document.getElementsByName("B");
 for(var i=0;i<radiovalue.length;i++)
 {
    // alert(radiovalue[i].checked);
     if(radiovalue[i].checked==true)
     {
         selectflag=1;
         break;
     }
 }
 if(selectflag==1)
 {
        alert('Its already selected');
        return false;
 }
 return true;
  }

在MouseDown上触发您的活动。它会正常工作。

Answer 7

我认为这是你正在寻找的东西：

<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<body>

 <input type="radio" name="A" checked="checked"  onclick="return check(this);"/>
 <input type="radio" name="A" onclick="return check(this);"/>
<script>
$( document ).ready(function() {
  this.currentradio = $("input[name='A']:checked")[0];
});
function check(t) {
     var newradio= $("input[name='A']:checked")[0]; 
    if (newradio===document.currentradio){
    alert('already selected');
        return false
    }else{
    document.currentradio = $("input[name='A']:checked")[0];
    }
 }
</script>
</body>
<html>

取消选择无线电输入选择

7 个答案: