根据jQuery Mobile中复选框的值激活某些表单元素

Question

我在jQuery Mobile 中有以下代码

  <fieldset data-role="controlgroup" data-type="horizontal" data-mini="true">
            <legend>Is this move permanent or temporary?</legend>
                <input type="radio" name="moveinfo" value="p" id="movetype_0" class="defhide required" checked="checked">
                <label for="movetype_0" id="permanentlabel">Permanent</label>
                <input type="radio" name="moveinfo" value="t" id="movetype_1" class="toggleCheck required ">
                <label for="movetype_1" id="temporarylabel">Temporary</label>
        </fieldset>  

如果选中了temporary（触摸事件），则应激活id为"stopdatediv"的新表单控件，该控件通常使用display none属性隐藏。

  <div id="stopdatediv" style="display:none">  
                <label for="stopdate" >Stop forwarding on</label>
                <input type="date" name="date" id="stopdate" value="" class="required" data-role="datebox"
   data-options='{"mode": "calbox"}'>
                </div>

我正在尝试绑定事件，但似乎不起作用。

jQuery(document).bind("pageinit", function (){
  jQuery("#movetype_1").on("tap", function(){
              jQuery("#stopdatediv").show();
  });
});

我尝试了，点击，点击等

如何显示stopdatediv。

Answer 1

jQuery("#movetype_1").on("change", function(){
              if ($(this).is(':checked'))
                  jQuery("#stopdatediv").show();
  });

Fiddle