Javascript 创建后动态检查单选按钮

Javascript 创建后动态检查单选按钮,javascript,jquery,html,jquery-mobile,Javascript,Jquery,Html,Jquery Mobile,我在应用程序中遇到的问题是,当我加载以下网页时,只检查最后一个单选按钮集,而我希望检查所有单选按钮集 for(var i=0; i<results.rows.length; i++){ if(results.rows.item(i).qst_status==0) //OK var x="<fieldset data-role='controlgroup' data-inline='true' data-type='horizontal'>

我在应用程序中遇到的问题是,当我加载以下网页时,只检查最后一个单选按钮集,而我希望检查所有单选按钮集

    for(var i=0; i<results.rows.length; i++){
    if(results.rows.item(i).qst_status==0)      //OK
        var x="<fieldset data-role='controlgroup' data-inline='true' data-type='horizontal'><input type='radio' name='radio-choice' id='radio-choice-1' value='OK' checked='checked' onclick='okpressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-1' style='width: 100px;'><img src='images/ok.png'></img></label><input type='radio' name='radio-choice' id='radio-choice-2' value='KO' onclick='kopressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-2' style='width: 100px;'><img src='images/ko.png'></img></label><input type='radio' name='radio-choice' id='radio-choice-3' value='NA' onclick='napressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-3' style='width: 100px; height:43px;'>N.A.</label></fieldset>";
    else if(results.rows.item(i).qst_status==1) //KO
        var x="<fieldset data-role='controlgroup' data-inline='true' data-type='horizontal'><input type='radio' name='radio-choice' id='radio-choice-1' value='OK' onclick='okpressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-1' style='width: 100px;'><img src='images/ok.png'></img></label><input type='radio' name='radio-choice' id='radio-choice-2' value='KO' checked='checked' onclick='kopressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-2' style='width: 100px;'><img src='images/ko.png'></img></label><input type='radio' name='radio-choice' id='radio-choice-3' value='NA' onclick='napressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-3' style='width: 100px; height:43px;'>N.A.</label></fieldset>";
    else if(results.rows.item(i).qst_status==2) //NA
        var x="<fieldset data-role='controlgroup' data-inline='true' data-type='horizontal'><input type='radio' name='radio-choice' id='radio-choice-1' value='OK' onclick='okpressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-1' style='width: 100px;'><img src='images/ok.png'></img></label><input type='radio' name='radio-choice' id='radio-choice-2' value='KO' onclick='kopressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-2' style='width: 100px;'><img src='images/ko.png'></img></label><input type='radio' name='radio-choice' id='radio-choice-3' value='NA' checked='checked' onclick='napressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-3' style='width: 100px; height:43px;'>N.A.</label></fieldset>";
    else                                        //Audit not completed
        var x="<fieldset data-role='controlgroup' data-inline='true' data-type='horizontal'><input type='radio' name='radio-choice' id='radio-choice-1' value='OK' onclick='okpressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-1' style='width: 100px;'><img src='images/ok.png'></img></label><input type='radio' name='radio-choice' id='radio-choice-2' value='KO' onclick='kopressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-2' style='width: 100px;'><img src='images/ko.png'></img></label><input type='radio' name='radio-choice' id='radio-choice-3' value='NA' onclick='napressed("+results.rows.item(i).qst_id+");'/><label for='radio-choice-3' style='width: 100px; height:43px;'>N.A.</label></fieldset>";
    if(adt_status=="completed"){            //Audit completed
        if(results.rows.item(i).chk_att==1) //Attachments
            var v="<td width='10%' align='right'><a href='cameraroll.html' rel='external' onclick='updID("+results.rows.item(i).chk_id+");'><img src='images/ico/attach.png'></img></a></td>";
        else                                //No attachments
            var v="<td width='10%'></td>";
    }
    else{                                   //Audit not completed
        if(results.rows.item(i).chk_att==1) //Ci sono allegati
            var v="<td width='10%' align='right'><a href='#mediapopup' data-rel='popup' onclick='updID("+results.rows.item(i).chk_id+");'><img src='images/ico/attach.png'></img></a></td>";
        else                                //No attachments
            var v="<td width='10%' align='right'><a href='#mediapopup_noall' data-rel='popup' onclick='updID("+results.rows.item(i).chk_id+");'><img src='images/ico/attach.png'></img></a></td>";
    }
    t=t+"<tr><td colspan='2' width='90%'><p>"+results.rows.item(i).qst_sent+"</p></td><td width='10%' align='center'><a href='#notepopup' data-role='button' data-icon='info' data-rel='popup' onclick='updNote(\""+results.rows.item(i).qst_help+"\");' data-transition='pop' data-iconpos='notext'></a></td></tr><tr><td width='45%'>"+x+"</td><td width='45%'><textarea style='height:50px; width:100%' id='note' name='note' placeholder='Insert here notes' onchange='checkNote(this.value, "+results.rows.item(i).qst_id+")'>"+results.rows.item(i).qst_note+"</textarea></td>"+v+"</tr><tr><td colspan='3'><hr></td></tr>";
    }
$("#checklisttable").append(t).trigger('create');
用于(var i=0;i此处的工作演示

首先,您需要将单选按钮属性更改为“选中”,然后将UI更改为选中的UI。否则,即使选中复选框,UI也不会更改

您可以选中/取消选中并查看选中的值

HTML 在这里工作

首先,您需要将单选按钮属性更改为“选中”,然后将UI更改为选中的UI。否则,即使选中复选框,UI也不会更改

您可以选中/取消选中并查看选中的值

HTML
仅供参考,您应该只将
id
s分配给一个元素。如果您希望将相同的
id
分配给多个元素,请使用一个类。单选按钮的工作方式是,如果它们具有相同的名称,就不能全部检查它们。
$('[type=radio]')。每个(函数(){$(this.prop('checked',true.)。checkboxradio('refresh');});
这将遍历所有单选按钮并检查它们。但是,每个组中只有一个单选按钮将被检查。单选按钮的行为是,在同一组(相同的属性名称)中只能检查一个单选按钮。因此,您想使用复选框或取消单选按钮分组您可以发布最终的HTML结果吗?基本上我想看到javascript HTML输出。仅供参考,您应该只将
id
s分配给一个元素。如果您想将相同的
id
分配给多个元素,请使用类。单选按钮的工作方式是如果名称相同,则无法全部检查。
$('[type=radio]')。每个(函数(){$(this).prop('checked',true.);checkboxradio('refresh');});
这将遍历所有单选按钮并检查它们。但是,每个组中只有一个单选按钮将被检查。单选按钮的行为是,在同一组中只能检查一个单选按钮(相同的attr名称)。那么,您想使用复选框或者取消收音机按钮的分组来发布最终的HTML结果吗?基本上我想看到javascript HTML输出。
<form id="checklisttable">
            <fieldset data-role="controlgroup">
                <legend>Vertical:</legend>
                <input type="checkbox" name="checkbox-v-2a" id="checkbox-v-2a">
                <label for="checkbox-v-2a">One</label>
                <input type="checkbox" name="checkbox-v-2b" id="checkbox-v-2b">
                <label for="checkbox-v-2b">Two</label>
                <input type="checkbox" name="checkbox-v-2c" id="checkbox-v-2c">
                <label for="checkbox-v-2c">Three</label>
                <input type="checkbox" name="checkbox-v-2d" id="checkbox-v-2d">
                <label for="checkbox-v-2d">Four</label>
            </fieldset>
        </form>
$(document).ready(function(){

    $("#checklisttable input").each(function(){            
        $(this).prop('checked', true);
    });

    $("#checklisttable label").addClass('ui-checkbox-on').removeClass('ui-checkbox-off');
    $("#checklisttable span.ui-icon").addClass('ui-icon-checkbox-on').removeClass('ui-icon-checkbox-off');
});