【问题标题】:Jquery adding class if another class has this class in loop如果另一个类在循环中有此类,则 Jquery 添加类
【发布时间】:2016-03-24 20:12:06
【问题描述】:
$(document).ready(function() {
  if ($("#grid .media-box").hasClass("brand1")) {
    $("#grid .media-box-content").addClass("brand01")
  };
}
});

在body循环的div网格中

<div id="grid">
  <?php foreach($data as $items) { ?>
  <div class="media-box video <?php  echo $items->brand; ?> <?php  echo $items->country; ?>">
    <div class="media-box-image">
      <div data-width="240" data-height="168" data-thumbnail="gallery/thumbnails/thumb-2.jpg"></div>
      <div data-type="iframe" data-popup="https://www.youtube.com/watch?v=5guMumPFBag" title="Psico dell consecteture"></div>
      <div class="thumbnail-overlay">
        <i class="fa fa-video-camera mb-open-popup"></i>
        <a href="#"><i class="fa fa-link"></i></a>
      </div>
    </div>
    <div class="media-box-content">
      <div class="media-box-title">Psico dell consecteture</div>
      <div class="media-box-date">
        <?php echo $items->country; ?></div>
      <div class="media-box-text">Lorem ipsum dolor sitam psico.</div>
      <div class="media-box-more"> <a href="#">Read more</a> 
      </div>
    </div>
  </div>
  <?php } ?>
</div>

CSS:

.media-box {
  font-size: 13px;
}
.brand01 {
  background: blue !important;
}
.media-box-content {
  padding: 20px;
  position: relative;
  color: rgb(51, 51, 51);
  line-height: 17px;
}

上面的代码对我不起作用。

 <?php  echo $items->brand; ?> <?php  echo $items->country; ?>" >

正在从数据库中获取 2 个类到潜水。

【问题讨论】:

    标签: javascript php jquery html css


    【解决方案1】:
    $("#grid .media-box.brand1").find(".media-box-content").addClass("brand01")
    

    如果条件为true,您的代码会将brand01 类添加到所有.media-box-content

    【讨论】:

      【解决方案2】:

      不需要使用if条件,你可以使用.toggleClass()和第二个arg作为函数,它返回一个布尔值true/false

      $(document).ready(function() {
          $("#grid .media-box-content").toggleClass("brand01", function(){
             return $(this).closest(".media-box").hasClass("brand1");
          });
      });
      

      我觉得你需要定位每个.media-box-content 并找到父.media-box 有类,如果有true 然后添加它如果false 删除它。

      【讨论】:

        【解决方案3】:

        使用它,它会工作

        $(document).ready(function() {
            $("#grid .media-box").each(function(index, element) {
                if ($(this).hasClass("brand1")) {
                    $(this).children(".media-box-content").addClass("brand01")
                  }
            });
        
        });
        

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 2020-10-06
          • 2019-01-16
          • 2016-10-18
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2023-03-20
          相关资源
          最近更新 更多