选中取消选中 Yes No 单选按钮以编程方式 jQuery Mobile答案

【问题标题】：check uncheck Yes No radio button programmatically jQuery Mobile选中取消选中 Yes No 单选按钮以编程方式 jQuery Mobile
【发布时间】：2012-09-14 14:40:47
【问题描述】：

我有一个数据库，其中我得到值 0 或 1（分别为否/是）。
如何在 jQuery Mobile 中选中/取消选中单选按钮并检查其状态。我的代码如下

HTML 代码

<label>Are you Mad? </label>   
 <fieldset data-role="controlgroup" data-type="horizontal">     
 <input data-mini="true" type="radio" name="rdIsBP" id="rdIsBPYes" value="" />
 <label for="rdIsBPYes">YES</label>
 <input data-mini="true"  type="radio" name="rdIsBP" id="rdIsBPNo" value="choice-1"  />
 <label for="rdIsBPNo">NO</label>
</fieldset>

JavaScript 代码

function  CheckRadioStateYNoo(val,rdButton){      
      try{
      var radios = document.getElementsByName(rdButton);
      for( i = 0; i < radios.length; i++ ) {
       if(i==0)
       {
          if(val==1) 
          {
              //radios[i].checked=true;
              $("#" + rdButton + "Yes").attr ("checked", "checked");
              alert('rdButton' +   radios[i].checked);               
          }          
      }
       else{
           if(val==1) 
           {
               radios[i].checked=true;
               alert('rdButton' +  radios[i].checked);               
           }
       }
      }
      }
      catch(e){alert(e);}
    }

【问题讨论】：

你的javascript代码怎么样？使用 jsfiddle 链接到它。
对不起，我想将单选按钮选中状态保存到 db 即 1 或 0，如果选中，则 state=1 else state=0 我应该怎么做

标签： jquery html jquery-mobile cordova radio-group

【解决方案1】：

$('#rdIsBPYes').prop('checked', value);
$('#rdIsBPNo').prop('checked', !value);

这是 jQuery 1.6 及更高版本的首选方式。

如果您的 jQuery 比 1.6 旧，您可以这样做：

if (value) {
   $('#rdIsBPYes').attr('checked','checked');
   $('#rdIsBPNo').removeAttr('checked');
} else {
   $('#rdIsBPNo').attr('checked','checked');
   $('#rdIsBPYes').removeAttr('checked');
}

更新：我误导了 .prop() 的语法，现已更正

【讨论】：

我不想改变它的值，只是它的状态，即选中或取消选中
这就是上面代码的作用，它不会改变值，它会改变检查状态，试试吧..
Eclipse 出现错误赋值的左侧必须是变量
是的，我的答案有误，我现在已经更正了，请检查我更新的答案代码。
对我不起作用仍然说赋值的左侧必须是变量

【解决方案2】：

我尝试了很多实验，只有这段代码对我有用

html代码

<label> Have you had surgery within the last 12 months?</label> 
            <fieldset data-role="controlgroup" data-type="horizontal">

            <input data-mini="true" type="radio" name="rdIsSurgery" id="rdIsSurgeryYes" value="choice-1" />
            <label for="rdIsSurgeryYes">YES</label>


            <input data-mini="true"  type="radio" name="rdIsSurgery" id="rdIsSurgeryNo" value="choice-4"  />
            <label for="rdIsSurgeryNo">NO</label>
    </fieldset>

js代码

 function  CheckRadioStateYN(val,rdButton){      
     try{
             if (val==1){               
                 $('#' + rdButton + 'Yes').attr('checked', true).checkboxradio('refresh');
                 $('#' + rdButton + 'No').removeAttr('checked');          
                     }
         else{
         $('#' + rdButton + 'No').attr('checked', true).checkboxradio('refresh');
         $('#' + rdButton + 'Yes').removeAttr('checked');

         }        
        }
          catch(e)
          {alert(e);}
        }

【讨论】：

【解决方案3】：

    <label>Are you Mad? </label>
    <fieldset data-role="controlgroup" data-type="horizontal">
        <input data-mini="true" type="radio" name="rdIsBP" class="fakeRadio" value="yes"  checked />
        <label for="rdIsBPYes">YES</label>
        <input data-mini="true"  type="radio" name="rdIsBP" class="fakeRadio" value="no"  />
        <label for="rdIsBPNo">NO</label>
    </fieldset>

jQuery

$(".fakeRadio").click(function(){
    $(".fakeRadio").prop( "checked", false );
    $(this).prop( "checked", true );

    /* If you need to grab the value */
    // var val = $(this).attr("value") ;  
    // alert(val);   
});

【讨论】：