在多个复选框中，如何存储一个答案JQuery移动

Question

我每页有多个问题。问题是，如果我回答第一个问题，然后当我检查第二个问题的答案时，第一个问题的答案将不受限制，我的目标是每个问题只有一个答案，答案将被储存起来。

​

$('input.answer').on('change', function() {
    $('input.answer').not(this).prop('checked', false);  
$('input.answer').not(this).prop('checked', false).checkboxradio("refresh");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<link href="https://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" rel="stylesheet"/>
<div class = "question">    
    
    
    <form>
    <fieldset data-role="controlgroup">
        <legend for="0-0">my goal is having one answer per each question?to reporduce check three in first question and then check seven in second question , you would see the first question three would be unchecked which is not my desire</legend>
        <label for="0-0-4">one</label>
        <input class="answer answer-num-0" type="checkbox" name="0-0-4" id="0-0-4" value="4">
        <label for="0-0-3">two</label>
        <input class="answer answer-num-0" type="checkbox" name="0-0-3" id="0-0-3" value="3">
        <label for="0-0-2">three</label>
        <input class="answer answer-num-0" type="checkbox" name="0-0-2" id="0-0-2" value="2">
        <label for="0-0-1">four</label>
        <input class="answer answer-num-0" type="checkbox" name="0-0-1" id="0-0-1" value="1">
        <label for="0-0-0">five</label>
        <input class="answer answer-num-0" type="checkbox" name="0-0-0" id="0-0-0" value="0">
    </fieldset>
    </form>
    
    </div>
            <div class="question">


        <form>
    <fieldset data-role="controlgroup">
        <legend for="1-0">this is second question but when i check any answer from first question then check one of the answer of second question , first question's answer will be uncheck which is undesired.</legend>
        <label for="0-1-4">six</label>
        <input class="answer answer-num-1" type="checkbox" name="0-1-4" id="0-1-4" value="4">
        <label for="0-1-3">seven</label>
        <input class="answer answer-num-1" type="checkbox" name="0-1-3" id="0-1-3" value="3">
        <label for="0-1-2">eight</label>
        <input class="answer answer-num-1" type="checkbox" name="0-1-2" id="0-1-2" value="2">
        <label for="0-1-1">nine</label>
        <input class="answer answer-num-1" type="checkbox" name="0-1-1" id="0-1-1" value="1">
        <label for="0-1-0">ten</label>
        <input class="answer answer-num-1" type="checkbox" name="0-1-0" id="0-1-0" value="0">
    </fieldset>
    </form>
    </div>
        <div class="question">
     <form>
    <fieldset data-role="controlgroup">
      <legend for="1-1">to reporduce check three in first question and then check seven in second question , you would see the first question three would be unchecked which is not my desire</legend>
     <label for="1-1-4">eleven</label>
        <input class="answer answer-num-4" type="checkbox" name="1-1-4" id="1-1-4" value="4">
        <label for="1-1-3">twelve</label>
        <input class="answer answer-num-4" type="checkbox" name="1-1-3" id="1-1-3" value="3">
        <label for="1-1-2">thirteen</label>
        <input class="answer answer-num-4" type="checkbox" name="1-1-2" id="1-1-2" value="2">
        <label for="1-1-1">fourteen</label>
        <input class="answer answer-num-4" type="checkbox" name="1-1-1" id="1-1-1" value="1">
        <label for="1-1-0">fifteen</label>
        <input class="answer answer-num-4" type="checkbox" name="1-1-0" id="1-1-0" value="0">
    </fieldset>
    </form>
      </div>

​

Answer 1

在jquery代码中，您必须指示只使用所选复选框的字段集.

$('input.answer').on('change', function() {

    $(this).closest('fieldset').find('input.answer').not(this).prop('checked',false).checkboxradio("refresh");  

});

我希望它能帮上忙