Question

使用此处介绍的方法 - http://www.techiegyan.com/2008/07/09/using-jquery-check-boxes-and-radio-buttons/

我想在选择“其他”单选按钮时显示字段，否则隐藏相同的字段。

该方法在非IE浏览器上正常工作，但在IE上工作（几乎）相反... 看起来IE在取消选择选项时会触发“更改”事件，而不是在选择它时。

这是html：

<div><label class="option" for="selection-1"><input type="radio" id="selection-1" name="submitted[selection]" value="10" checked="checked" class="form-radio"> 10</label></div>
<div><label class="option" for="selection-2"><input type="radio" id="selection-2" name="submitted[selection]" value="20" class="form-radio"> 20</label></div>
<div><label class="option" for="selection-3"><input type="radio" id="selection-3" name="submitted[selection]" value="50" class="form-radio"> 50</label></div>
<div><label class="option" for="selection-4"><input type="radio" id="selection-4" name="submitted[selection]" value="100" class="form-radio"> 100</label></div>
<div><label class="option" for="selection-5"><input type="radio" id="selection-5" name="submitted[selection]" value="0" class="form-radio">other</label></div>

<div id="other-selection-wrapper">
 <label for="other-selection">other:</label>
 <input type="text" maxlength="10" name="submitted[other_selection]" id="other-selection" size="10" value="" class="form-text">
</div>

和脚本代码：

<script type="text/javascript">
$(document).ready(function(){
  $('#other-selection-wrapper').hide();

  $("input[@name='submitted[selection]']").change(function(){
    if ($("input[@name='submitted[selection]']:checked").val() == '0')
      { $('#other-selection-wrapper').show();   }
    else
      { $('#other-selection-wrapper').hide(); }
  });

});
</script>

Answer 1

从您举例的网站

但我忘记提及，互联网 Exploiter只有在你使用时才能这样做 .click（）而不是.change（）

Answer 2

为什么要尝试将无线电组分配给html数组？ name =“selection”很好......

从那以后你应该能够显示/隐藏其他文本框：

<div>.....</div>
<div><label class="option" for="selection-5"><input type="radio" id="selection-5" name="selection" value="0" class="form-radio">other</label></div>

<div id="other-selection-wrapper">
    <label for="other-selection">other:</label>
    <input type="text" maxlength="10" name="submitted[other_selection]" id="other-selection" size="10" value="" class="form-text">
</div>

jquery：

$('input[name="selection"]:radio').click(function(){
    if($('input[name="selection"]:radio:checked').val() == 0){
        $('#selection-wrapper').css({'display':'block'});
    }else{
        $('#selection-wrapper').css({'display':'none'});
    }
});

[未测试]

用于IE的单选按钮的jquery动作

2 个答案: