Question

我需要隐藏祖父母兄弟姐妹的孩子。我陷入了复杂的情况，我在 <li> 中有三个 <ul> 。现在html的结构是这样的

<ul>
<li>..</li>
<li>..</li>
<li>..</li>
</ul>

在每个 li 中，这是 html

      <div class="chbs-vehicle chbs-clear-fix">

         <div class="chbs-vehicle-image chbs-vehicle-image-has-gallery" style="opacity: 1;">
            </div>
            <div class="chbs-vehicle-content">                
                <div class="chbs-vehicle-content-header"> 
                    <span>Sedan</span>                        
            <a href="#" class="chbs-button chbs-button-style-2">
                Select
                <span class="chbs-meta-icon-tick"></span>
            </a>                       
               </div>                   
            <div class="chbs-vehicle-content-price">€42.00</div>                
            </div>
            </div>

因此，当我点击 chbs-button-style-2 时，我想将 chbs-vehicle-content-price div 隐藏在所有其他 li 中，这些 <script type="text/javascript"> jQuery(document).ready(function($){ $('.chbs-button-style-2').on('click', function() { alert($(this).closest('li').siblings().children().find('.chbs-vehicle-content-price').html()); //Here I am getting Undefined }); }); </script> 是此祖父母兄弟姐妹的孩子。

这就是我被卡住的地方

drawFrame

Answer 1

使用 .hide() 方法：

jQuery(document).ready(function($) {
  $('.chbs-button-style-2').on('click', function() {
    $(this).closest('li').siblings().children().find('.chbs-vehicle-content-price').hide();
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
  <li>
    <div class="chbs-vehicle chbs-clear-fix">

      <div class="chbs-vehicle-image chbs-vehicle-image-has-gallery" style="opacity: 1;">
      </div>
      <div class="chbs-vehicle-content">
        <div class="chbs-vehicle-content-header">
          <span>Sedan</span>
          <a href="#" class="chbs-button chbs-button-style-2">
                Select
                <span class="chbs-meta-icon-tick"></span>
            </a>
        </div>
        <div class="chbs-vehicle-content-price">€42.00</div>
      </div>
    </div>
  </li>
  <li>
    <div class="chbs-vehicle chbs-clear-fix">

      <div class="chbs-vehicle-image chbs-vehicle-image-has-gallery" style="opacity: 1;">
      </div>
      <div class="chbs-vehicle-content">
        <div class="chbs-vehicle-content-header">
          <span>Sedan</span>
          <a href="#" class="chbs-button chbs-button-style-2">
                Select
                <span class="chbs-meta-icon-tick"></span>
            </a>
        </div>
        <div class="chbs-vehicle-content-price">€42.00</div>
      </div>
    </div>
  </li>
  <li>
    <div class="chbs-vehicle chbs-clear-fix">

      <div class="chbs-vehicle-image chbs-vehicle-image-has-gallery" style="opacity: 1;">
      </div>
      <div class="chbs-vehicle-content">
        <div class="chbs-vehicle-content-header">
          <span>Sedan</span>
          <a href="#" class="chbs-button chbs-button-style-2">
                Select
                <span class="chbs-meta-icon-tick"></span>
            </a>
        </div>
        <div class="chbs-vehicle-content-price">€42.00</div>
      </div>
    </div>
  </li>
</ul>

在 jQuery 中隐藏祖父母兄弟姐妹的孩子

1 个答案: