单选按钮没有被第二次检查

Question

我有一组问题是基于调查的应用程序每一页都有一个问题与答案和上一个，下一个按钮。 当我第一次检查它工作正常。如果用户单击prev或下一个按钮时修改答案，则单击之前未在单选按钮中选中的值。

我的代码如下

HTML

<div id="survey-screen" data-role="page"> 
    <div class="header-bgcolor" data-role="header"> 
     <div id="wrapper"> 
     <div class="jumbotron"> 
      <h1> 
       <a href="#"> 
       <img src="images/teleperformance-logo.png" class="img-responsive" width="536" height="109"> 
       </a> 
      </h1> 
     </div> 
     </div> 
    </div> 
    <div class="innerContainer" data-role="main"> 
     <div id="wrapper"> 
     <div class="login select-location"> 
      <div class="divs"> 
      </div> 
      <div class="form-group center-button"> 
       <a class="btn btn-lg btn-primary btn-block" id="next">Next</a> 
      </div> 
      <div class="form-group center-button"> 
       <a class="btn btn-lg btn-primary btn-block" id="prev">Prev</a> 
      </div> 
      <div class="form-group center-button"> 
       <a class="btn btn-lg btn-primary btn-block" id="sub">submit</a> 
      </div> 
      <!--<a id="next" style="background-color:#fff;color:#000;padding:3px;">next</a> 
       <a id="prev" style="background-color:#fff;color:#000;padding:3px;">prev</a>--> 
     </div> 
     </div> 
    </div> 
</div> 

jQuery的

$("#next").on('click', function(){ 

    $('#prev').show(); 
    // alert($('.divs').html()); 
    var id = $(".divs div:visible").attr("id"); 
    var last_id = $('.divs').children().last().attr('id'); 
    var nxt_id = +id + +1; 
    var id1 = "#" + id + " input[type='radio']:checked"; 
    alert($("#"+nxt_id+" input[type='radio']").is(':checked') + "Next Value"); 
    var value = $(id1).val(); 

    //alert(value); 
    if(value == null || value == '' || value ==undefined) { 
     value = 'no answer'; 
    } 
    //alert(value + "second"); 
    var myObj = {}; 
    myObj["question"] = $('#label-'+id).text(); 
    myObj["value"] = value; 
    myObj["notes"] = $('#textarea-' + id).val(); 

    var result = {value:value,notes:value}; 
    map[id] = myObj 
    for (var i in map) { 
     //alert(i); 
     //alert(map[i]); 
    } 
    if(nxt_id == last_id) { 
     $('#next').hide(); 
    } 

    if ($(".divs > div:visible").next().length != 0) 

     $(".divs > div:visible").next().show().prev().hide(); 
    else { 
     $(".divs > div:visible").hide(); 

     $(".divs > div:first").show(); 

    } 

    $('.divs div.ui-radio').css("display","block"); 

    $('.divs div.select-checkbox').css("display","block"); 

    $('.divs div.select-textarea').css("display","block"); 

    return false; 

}); 


$("#prev").on('click', function(){ 
    $('#next').show(); 
    //alert($('.divs').html()); 
    var id = $(".divs div:visible").attr("id"); 
    var value = $("#"+id+" input[type='radio']:checked").val(); 

    var first_id = $('.divs').children().first().attr('id'); 
    var pre_id = id-1; 
    alert($("#"+pre_id+" input[type='radio']").is(':checked')); 
    if(value == null || value == '' || value ==undefined) { 
     value = 'no answer'; 
    } 

    var myObj = {}; 
    myObj["question"] = $('#label-'+id).text(); 
    myObj["value"] = value; 
    myObj["notes"] = $('#textarea-' + id).val(); 
    map[id] = myObj; 

    var preValue = map[pre_id].value; 
    alert(preValue + " = " + pre_id); 

    //$("input[id=radio-" + pre_id + "][value='" + preValue + "']").attr("checked",true).checkboxradio("refresh"); 
    //for (var i in map) { 
     // alert(i); 
     //alert(map[i]); 
    //} 
    if(pre_id == first_id) { 
     $('#prev').hide(); 
    } 
    if ($(".divs > div:visible").prev().length != 0) { 
     $(".divs > div:visible").prev().show().next().hide(); 
    } else { 
     $(".divs > div:visible").hide(); 
     $(".divs > div:last").show(); 
    } 
    var chk_id = "#"+pre_id+" input:radio[value=" + preValue + "]:first"; 
    alert(chk_id); 
    $(chk_id).attr("checked", "checked"); 
    $("input[type='radio']").checkboxradio("refresh"); 
    $('.divs div.ui-radio').css("display","block"); 
    $('.divs div.select-textarea').css("display","block"); 
    $('.divs div.select-checkbox').css("display","block"); 
    return false; 
}); 

$(".checkbox").on('click',function(){ 
$(this).toggleClass('checked') 
}); 

如何实现这一目标？

Answer 1

您不应该使用attr()来（取消）选中复选框。

请改用prop()。

$(chk_id).prop("checked", true); 

有关how to use prop() with checkboxes的更多信息已经在*.com上。