<div class="book">
<div class="title_lit">
<div class="title_inner">书籍<span onclick="showbook()">更多></span></div>
</div>
<div class="line_in"></div>
<div class="content" id="content_book" style="display: block;">
<div class="lit_box" v-for="(item,index) in bookArr" v-if="index < 4" :key='item.rowId' @click="BookClic(item.rowGuid,item.bookPic)">
<div class="book_img">
<img :src="url+item.bookPic" />
</div>
<div class="book_tit">
{{item.bookName}}
</div>
</div>
</div>
<div class="list" id="list_book" style="display: none;">
<div class="group" v-for="(item,index) in bookArr" :key='item.rowId' @click="BookClic(item.rowGuid,item.bookPic)">
<div class="name">{{item.bookName}}</div>
<div class="time">{{item.createTime}}</div>
</div>
</div>
</div>
javascript:切换两个div的内容。网上说toggle()在jquery1.9之后不支持了。我jquery2.4还有效就没有用其他方法。
function showbook(){
$("#list_book").toggle();
$("#content_book").toggle();
}
function showvideo(){
$("#list_video").toggle();
$("#content_video").toggle();
}
点击更多隐藏当前内容,出现列表内容。获取数据用的vue