Question

我有10组单选按钮，每组有2个单选按钮，其值为Accept / Reject。一组中的2个单选按钮将具有相同的名称。

我的要求是：每当用户选择设置计数器中的单选按钮时，应增加1。如果用户在单选按钮组中选择接受，则计数器增加1。如果他再次在第二组中选择接受，则计数器再次增加1.但是如果他在第一个单选按钮组中改变他拒绝的决定，则计数器不应该增加。

我使用此计数器的原因是确定用户在提交表单之前有许多未保存的更改。此外，我不能在单选按钮上使用onchange事件，因为如果单选按钮已被选为接受，并且用户将其更改为拒绝，则不应增加计数器。但是通过onchange事件，它会。

以下是我的代码：

<input id="8adb94f9516be1ac01517097980900db" name="certItemIdRadio-8adb94f9516be1ac01517097980900db" value="Accept" type="radio">
<input id="8adb94f9516be1ac01517097980900db" name="certItemIdRadio-8adb94f9516be1ac01517097980900db" value="Reject" type="radio">

<input id="8adb94f9516be1ac01517097980900dc" name="certItemIdRadio-8adb94f9516be1ac01517097980900dc" value="Accept" type="radio">
<input id="8adb94f9516be1ac01517097980900dc" name="certItemIdRadio-8adb94f9516be1ac01517097980900dc" value="Reject" type="radio">

<input id="8adb94f9516be1ac01517097980900dd" name="certItemIdRadio-8adb94f9516be1ac01517097980900dd" value="Accept" type="radio">
<input id="8adb94f9516be1ac01517097980900dd" name="certItemIdRadio-8adb94f9516be1ac01517097980900dd" value="Reject" type="radio">

<input id="8adb94f9516be1ac01517097980900de" name="certItemIdRadio-8adb94f9516be1ac01517097980900de" value="Accept" type="radio">
<input id="8adb94f9516be1ac01517097980900de" name="certItemIdRadio-8adb94f9516be1ac01517097980900de" value="Reject" type="radio">

请建议。

Answer 1

如果不跟踪哪些按钮已被更改，则无法解决问题。因此，每个广播组都需要一个索引或ID，您可以在这样的地图中跟踪它们：

var changedGroups = {}

function countChange(groupIndex) { // called from onchange
    changedGroups[groupIndex] = true;
}

function numberOfChanges() { // called when you need the number of changes
    var result = 0;
    for (index in changedGroups) result++;
    return result;
}

Answer 2

尝试：

$('input[type="radio"]').on('click',function(){
 $('.totleft').text($('input[type="radio"]:checked').length+'/'+($('input[type="radio"]').length/2))
});

https://jsfiddle.net/gvx3nL9p/

Answer 3

如果您使用JQuery，则可以使用以下逻辑。

before()

Answer 4

这是你需要做的事情

＆＃13;

$('.counter').text($(':radio:checked').length);

$('input[type=radio]').change(function(){
  $('.counter').text($(':radio:checked').length);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
1.
<input id="a" name="certItemIdRadio-8adb94f9516be1ac01517097980900db" value="Accept" type="radio">
<input id="b" name="certItemIdRadio-8adb94f9516be1ac01517097980900db" value="Reject" type="radio">
<br/>
2.
<input id="c" name="certItemIdRadio-8adb94f9516be1ac01517097980900dc" value="Accept" type="radio">
<input id="d" name="certItemIdRadio-8adb94f9516be1ac01517097980900dc" value="Reject" type="radio">
<br/>
3.
<input id="e" name="certItemIdRadio-8adb94f9516be1ac01517097980900dd" value="Accept" type="radio">
<input id="f" name="certItemIdRadio-8adb94f9516be1ac01517097980900dd" value="Reject" type="radio">
<br/>
4.
<input id="g" name="certItemIdRadio-8adb94f9516be1ac01517097980900de" value="Accept" type="radio">
<input id="h" name="certItemIdRadio-8adb94f9516be1ac01517097980900de" value="Reject" type="radio">

<br/><br/>
No. of Selected Options: <span class="counter"></span>

＆＃13;

依靠单选按钮检查

4 个答案: