$(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个课程。
答案 0 :(得分:1)
$("#grid .media-box.brand1").find(".media-box-content").addClass("brand01")
如果条件为brand01
,您的代码会将.media-box-content
课程添加到所有true
。
答案 1 :(得分:0)
没有必要使用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
删除它时添加它。
答案 2 :(得分:0)
使用它,它将起作用
$(document).ready(function() {
$("#grid .media-box").each(function(index, element) {
if ($(this).hasClass("brand1")) {
$(this).children(".media-box-content").addClass("brand01")
}
});
});