js:
$.ajax({
async:true,
dataType:"json",
url:"/member/showHansonMember",
success:function(data){
$('#slider').flexslider({
animation: "slide",
controlNav: false,
animationLoop: false,
slideshow: false,
slideshow: false,
sync: "#carousel"
});
var str='';
for(var i=0;i<data.length;i++){
str = `<li>
<div class='avatar'>
<img src='" + url+data[i].memberImg + "' alt='决策'>
</div>
<h2>${data[i].memberMessage}</h2>
<p class=\"author\">${data[i].memberPosition}</p>
</li>`;
$('#slider').data('flexslider').addSlide(str);
}
}
});
html:
<div class="flexslider" id="slider">
<ul class="slides" id="memberList">
</ul>
</div>
效果:
注意:不能用append拼接
参考 https://stackoverflow.com/questions/27542147/dynamic-add-slide-in-flexslider-carousel