具体功能展示如图
<?php $txt='';
if($house['activity_tags']!=[]){
foreach($house['activity_tags'] as $key => $item){
$txt .='<div class="activity_cen activity_up"><span class="activity_left">'.$item['activity_type'].'</span><span class="activity_nav">'.$item['activity_tag'].'</span><span class="activity_unfold activity_unfold_'.$key.'" οnclick="unfold('.$key.')"> > </span> <span class="hide activity_shut activity_shut_'.$key.'" οnclick="activity_shut('.$key.')"> v </span></div>';
$txt .='<div class="hide activity_tags_'.$key.'" >';
$txt .='<div class="activity_cen">';
$txt .='<span class="activity_obj">[活动对象]</span>';
$txt .='<span class="activity_nav">'.$item['activity_object'].'</span>';
$txt .='</div>';
$txt .='<div class="activity_cen">';
$txt .='<span class="activity_obj">[签约类型]</span>';
$txt .='<span class="activity_nav">'.$item['contract_type'].'</span>';
$txt .='</div>';
$txt .='<div class="activity_cen"><span class="activity_obj">[活动说明]</span></div>';
$txt .='<div class="activity_cen"><span class="activity_obj">'.$item['activity_rules'].'</span></div>';
$txt .='</div>';
}
echo $txt; }?>
// 活动标签详情
$('#activity_show').on('click', function () {
$('#activity_box').show()
})
$('#close').on('click', function () {
$('#activity_box').hide()
})
// 活动规则说明
this.unfold = function (i) {
$('.activity_tags_' + i).removeClass('hide')
$('.activity_shut_' + i).removeClass('hide')
$('.activity_unfold_' + i).addClass('hide')
}
this.activity_shut = function (i) {
$('.activity_unfold_' + i).removeClass('hide')
$('.activity_tags_' + i).addClass('hide')
$('.activity_shut_' + i).addClass('hide')
}
通过第一步便利数组,首先需要在点击当前的时候把index值传递过去
jq通过方法接收,通过定义的hide class,控制当前索引的展示或者隐藏,移出hide,或者添加hide