Question

我正在尝试执行简单的隐藏/显示效果，具体取决于选中的单选按钮。这不正常，我不知道为什么。当用户点击“Oui”时，我想隐藏的表格（#reprint_oui）到SHOW ...如果选择“非”，则隐藏。

这是我的JS代码：

$(document).ready(function(){

$("input[name$='reprint_group']").click(function(){

var radio_value = $(this).val();

if(radio_value=='Oui') {
    $("#reprint_oui").show("slow");
}
else if(radio_value=='Non') {
   $("#reprint_oui").show("slow");
   }
  });

$("#reprint_oui").hide();

});

这是我的HTML：

<h2>Fiche technique de production</h2>
      <table width="100%" border="0">
          <tr>
            <td width="80%">Avons-nous par le passé produit des affiches que vous vous apprêtez à commander?</td>
            <td width="20%"><label for="oui_reprint">Oui</label>
            <input name="reprint_group" type="radio" id="oui_reprint" value="Oui">
            <label for="non_newprint">Non</label>
            <input type="radio" name="reprint_group" id="non_newprint" value="Non"></td>
        </tr>
      </table>
      <table width="100%" border="0" id="reprint_oui">
        <tr>
          <td width="80%">S'agit-il d'une réimpression sans changement?</td>
          <td width="20%"><label for="oui_reprint">Oui</label>
            <input type="radio" name="reprint_sans_changement" id="oui_reprint" value="Oui">
            <label for="non_newprint">Non</label>
            <input type="radio" name="reprint_sans_changement" id="non_newprint" value="Non"></td>
        </tr>
      </table>

这是我的fiddle

谢谢

Answer 1

当无线电值为show时，您实际上是Non。将其更改为hide()：

if (radio_value == 'Oui') {
  $("#reprint_oui").show("slow");
} else if(radio_value == 'Non') {
  $("#reprint_oui").hide("slow"); // you have show() here
}

<强> DEMO

Answer 2

if-else的结果显示了reprint_oui元素。

“非”

时隐藏元素

http://jsfiddle.net/25KkU/1/

还要确保在javascript中进行比较时使用三联“=”：

if(a===b)
{}

单选按钮选择 - 隐藏和显示字段

2 个答案: