根据单选按钮显示/隐藏内容

用户3733831

我试图根据单选按钮的选择切换内容DIV。

单选按钮的HTML。

<div class="row-fluid">
    <label class="radio">
      <input type="radio" name="account" id="yes" value="yes" checked>
      Yes, I have an existing account
    </label>
    <label class="radio">
      <input type="radio" name="account" id="no" value="no">
      No, I don't have an account
    </label>
</div>

内容DIV

<div id="account_contents">
    <p>This is account contents.......</p>  
</div>

这就是我在jquery中尝试过的方法。

$('#no').bind('change',function(){
  $('#account_contents').fadeToggle(!$(this).is(':checked'));
  $('#account_contents').find("input").val("");
  $('#account_contents').find('select option:first').prop('selected',true);
});

但这对我来说不正确。在这里,我只想在用户没有帐户的情况下显示此内容DIV。

谁能告诉我如何解决这个问题?

穆罕默德·优素福

似乎您需要.on('change')单选按钮,而不仅仅是其中一个

$('input[type="radio"][name="account"]').on('change',function(){
  var ThisIt = $(this);
  if(ThisIt.val() == "yes"){
       // when user select yes
       $('#account_contents').fadeOut();
  }else{
       // when user select no
       $('#account_contents').fadeIn();
       $('#account_contents').find("input").val("");
       $('#account_contents').find('select option:first').prop('selected',true);
  }
});

工作范例

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

单选按钮显示/隐藏内容

来自分类Dev

根据单选点击显示/隐藏内容

来自分类Dev

根据单选按钮选择显示/隐藏div

来自分类Dev

根据单选按钮选择显示/隐藏div

来自分类Dev

如何根据从外部单选按钮组单击的内容显示或隐藏<option>?

来自分类Dev

如何根据从外部单选按钮组单击的内容显示或隐藏<option>?

来自分类Dev

jQuery单选按钮根据选择/选中显示/隐藏

来自分类Dev

如何根据单选按钮单击显示和隐藏div?

来自分类Dev

根据所选单选按钮的组合显示/隐藏div

来自分类Dev

根据单选按钮显示或隐藏div(已选中/未选中)

来自分类Dev

根据两个单选按钮显示和隐藏div

来自分类Dev

根据单选按钮值显示或隐藏表格行

来自分类Dev

使用JQuery选中单选按钮时显示隐藏内容

来自分类Dev

基于 jQuery 中的单选按钮选择显示和隐藏内容

来自分类Dev

如何根据用户选择的单选按钮更改显示内容?

来自分类Dev

单选按钮是隐藏的,不会显示

来自分类Dev

根据单选按钮显示表单

来自分类Dev

如果选中单选按钮,则隐藏内容

来自分类Dev

如果选中单选按钮,则隐藏内容

来自分类Dev

根据单选按钮选择使用jQuery隐藏/显示文本框

来自分类Dev

如何根据jsf中的单选按钮值隐藏或显示文本框

来自分类Dev

Angular 9 Reactive表单根据单选按钮选择显示隐藏div

来自分类Dev

根据单选按钮选择,使用jQuery隐藏/显示文本框

来自分类Dev

根据单选按钮列表值显示隐藏文本框

来自分类Dev

在单选按钮上使用引导程序“折叠”来显示/隐藏内容(NO JS)

来自分类Dev

jQuery clone():原始内容的单选按钮单击显示/隐藏不起作用

来自分类Dev

根据选择的单选按钮设置div的内容

来自分类Dev

显示隐藏的div以选择单选按钮jquery

来自分类Dev

单选按钮隐藏和显示问题

Related 相关文章

  1. 1

    单选按钮显示/隐藏内容

  2. 2

    根据单选点击显示/隐藏内容

  3. 3

    根据单选按钮选择显示/隐藏div

  4. 4

    根据单选按钮选择显示/隐藏div

  5. 5

    如何根据从外部单选按钮组单击的内容显示或隐藏<option>?

  6. 6

    如何根据从外部单选按钮组单击的内容显示或隐藏<option>?

  7. 7

    jQuery单选按钮根据选择/选中显示/隐藏

  8. 8

    如何根据单选按钮单击显示和隐藏div?

  9. 9

    根据所选单选按钮的组合显示/隐藏div

  10. 10

    根据单选按钮显示或隐藏div(已选中/未选中)

  11. 11

    根据两个单选按钮显示和隐藏div

  12. 12

    根据单选按钮值显示或隐藏表格行

  13. 13

    使用JQuery选中单选按钮时显示隐藏内容

  14. 14

    基于 jQuery 中的单选按钮选择显示和隐藏内容

  15. 15

    如何根据用户选择的单选按钮更改显示内容?

  16. 16

    单选按钮是隐藏的,不会显示

  17. 17

    根据单选按钮显示表单

  18. 18

    如果选中单选按钮,则隐藏内容

  19. 19

    如果选中单选按钮,则隐藏内容

  20. 20

    根据单选按钮选择使用jQuery隐藏/显示文本框

  21. 21

    如何根据jsf中的单选按钮值隐藏或显示文本框

  22. 22

    Angular 9 Reactive表单根据单选按钮选择显示隐藏div

  23. 23

    根据单选按钮选择,使用jQuery隐藏/显示文本框

  24. 24

    根据单选按钮列表值显示隐藏文本框

  25. 25

    在单选按钮上使用引导程序“折叠”来显示/隐藏内容(NO JS)

  26. 26

    jQuery clone():原始内容的单选按钮单击显示/隐藏不起作用

  27. 27

    根据选择的单选按钮设置div的内容

  28. 28

    显示隐藏的div以选择单选按钮jquery

  29. 29

    单选按钮隐藏和显示问题

热门标签

归档