Question

在这个html中：

    $('#endre_dinmeny').click(function() {
        $('.form-validate').children('.label-visible').hide();
        $('.form-validate').children('.edit-visible').show();
    });

<span id="endre_dinmeny" class="col-md-6 bestill-edit2">Endre</span>
<div class="form-validate">
  <div class="row">
    <label class="col-md-4">
      Leveringsfrekvens
    </label>
    <div class="label-visible">
      view
    </div>
    <div class="edit-visible">
      edit
    </div>
  </div>
</div>

我做错了什么，它没有绝对没有做什么？我已经差不多48小时了，所以请你，如果你发现了一个菜鸟的错误，请保持温和，但我已经厌倦了用这个来敲我的头..

最诚挚的问候，

Answer 1

使用find()

 $('.form-validate').find('.label-visible').hide();
 $('.form-validate').find('.edit-visible').show();

find('.label-visible')无效，因为.label-visible不是直接的孩子。

children()只会搜索直接后代。 Find将直接搜索和嵌套后代。

最后，如果您有多个.form-validate元素，则应使用$(this)

缩小上下文范围

$(this).find('.form-validate .label-visible').hide();
$(this).find('.form-validate .edit-visible').show();

Answer 2

要切换给定元素的子元素，您必须使用find。但最重要的是你必须将它与当前元素$(this)

一起使用

  $('#endre_dinmeny').click(function() {
    $(this).find('.form-validate .label-visible').hide();
    $(this).find('.form-validate .edit-visible').show();
  });

jquery显示/隐藏给定元素的所有子元素

2 个答案: