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

时间:2012-09-22 10:34:21

标签: jquery html5 jquery-mobile cordova radio-group

我有一个数据库,我得到的值为0或1(分别为No / Yes) 如何检查/取消选中单选按钮并在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);}
    }

3 个答案:

答案 0 :(得分:4)

$('#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()的语法,现已更正

答案 1 :(得分:0)

我试过很多实验只有这个代码对我有用了,对于unchceck来说,val可以是0,而对于db.maybe来说,1可以检查一下这个代码是否有用

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 code

 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);}
        }

答案 2 :(得分:0)

    <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);   
});