javascript - jQuery 移动 radio 事件监听器

Question

我想在选中单选按钮以添加输入文本时放置一个监听器，但我并不真正了解监听器在 jquery mobile 上的工作方式。 (当选中“radio_choice_v_6c”时，我想显示“autrenumero”)(我真的不知道如何添加监听器)(抱歉英语不好)

<fieldset id="NumTel" data-role="controlgroup" data-theme="a">
      <input name="radio_choice_v_6" id="radio_choice_v_6a" type="radio" checked="checked" value="on">
      <label name="radio_numTel" for="radio_choice-v-6a"></label>
      <input name="radio_choice_v_6" id="radio_choice_v_6b" type="radio" value="off">
      <label name="radio_numMob" for="radio_choice_v_6b"></label> 
      <input name="radio_choice_v_6" id="radio_choice_v_6c" type="radio" value="off">
      <label for="radio_choice_v_6c">Appelez-moi sur ce numéro :</label>
</fieldset>

<div id="labelAutreNumero">
  <input name="autrenumero" id="autrenumero" type="number" value="" placeholder="Numéro" data-mini="true" data-clear-btn="true">
</div>  

谢谢

Answer 1

给每个单选按钮一个唯一的值:

<fieldset id="NumTel" data-role="controlgroup">
    <input type="radio" name="radio_choice_v_6" id="radio-choice-v-6a" value="on" checked="checked" />
    <label for="radio-choice-v-6a">Choice One</label>
    <input type="radio" name="radio_choice_v_6" id="radio-choice-v-6b" value="off" />
    <label for="radio-choice-v-6b">Choice Two</label>
    <input type="radio" name="radio_choice_v_6" id="radio-choice-v-6c" value="numero" />
    <label for="radio-choice-v-6c">Appelez-moi sur ce numéro :</label>
</fieldset>
<div id="labelAutreNumero">
    <input name="autrenumero" id="autrenumero" type="number" value="" placeholder="Numéro" data-mini="true" data-clear-btn="true" />
</div>

然后在 jQM pagecreate 中绑定(bind)更改事件:

$(document).on("pagecreate", "#page1", function(){
    $("#labelAutreNumero").hide();

    $("input[name='radio_choice_v_6']").on("change", function() {
        if ($("input[name='radio_choice_v_6']:checked").val() == 'numero')
            $("#labelAutreNumero").show();
        else
            $("#labelAutreNumero").hide();
    });
});

在脚本中，我们等待 jQM 创建 page1，以便 DOM 准备就绪。然后我们隐藏输入的数字，等待第三个 radio 被检查。接下来，我们处理名称为 radio_choice_v_6 的所有单选按钮上的更改事件。在这里，我们获取选中的单选按钮并读取其值，然后根据该值显示或隐藏输入。

Here is a working DEMO