Question

所以我有一份表格的种族清单。对于那些不符合任何其他标准的人，有一个名为“其他指定”的框。当需要检查“其他指定”时，我需要一本教科书才能显示，而当它不是时，我需要消失。我已经能够在检查另一个时显示该框，但在未选中时不会消失。任何帮助将不胜感激。感谢。

的Jscript

<script type="text/javascript" src="jquery.js">
 <script language="JavaScript">

 $(function(){ 
  $('#other').click(function(){ 
  $('#otherrace').toggle(
          function(event) {
            $(event.target).css('visible');
          },
          function(event) {
            $(event.target).css('hidden');
          }
        );
      });


    </script>

HTML

<input type="checkbox" name="race"  id="other"value="other" />Other, specify<br />
<div style="visibility:hidden" id="race"><input type="text" name="fname" size="25" maxlength="25" id="otherrace" /></div>

Answer 1

这样做：

示例： http://jsfiddle.net/patrick_dw/K3kvE/

$('#other').change(function(){ 
    $('#otherrace').parent().css( 'visibility', this.checked ? 'visible' : 'hidden' );
});

或使用display:none代替visibility:hidden并执行此操作：

示例： http://jsfiddle.net/patrick_dw/K3kvE/1/

$('#other').change(function(){ 
    $('#otherrace').parent().toggle( this.checked );
});

您使用.toggle()的方式是作为“切换事件”，这意味着您有效地分配了一个点击事件，该事件在执行您传递的功能之间切换。

由于隐藏了otherrace的父级，因此您需要使用.parent()遍历它，然后将其visibility属性设置为hidden或{ {1}}取决于复选框的状态。

第二个解决方案从使用visible属性更改为使用visibility，以便可以以不同方式调用toggle()。它现在被调用的方式，它在show()和hide()之间切换，将display属性从display设置为原始设置并返回。

根据复选框的状态切换文本框的可见性 - jquery

1 个答案: