标签:data style href demo arp src omd ons cti
jquery部分
<script type="text/javascript">
$(document).ready(function() {
$("#owl-demolpo").owlCarousel({
items: 4,
navigation: true,
navigationText: ["",""],
dataType : ‘jsonp‘,
jsonp: ‘jsonpCallback‘,
jsonPath : ‘你的json数据页面/aaa.php‘,
jsonSuccess : customDataSuccess
});
});
</script>
<script type="text/javascript">
function customDataSuccess(huodong){
var SchoolDetail = ‘‘;
for (var j = 0; j < huodong.length; j++) {
var imgurl=huodong[j].photoUrl;
SchoolDetail += ‘<div class="yijj item"> ‘
+‘ <p class="p1"><img style="width:195px;height:150px;" src=‘+imgurl +‘> </p>‘
+‘ <p class="p2"><a href="‘+huodong[j].activityUrl+‘">‘+huodong[j].activityName+‘ </a></p>‘
+‘ </div>‘;
}
$("#owl-demolpo").html(SchoolDetail);
}
</script>
json数据页面
[{"activityName":"期中试卷免费诊断","activityUrl":"http://wenzhangurl.cn/huodong/123","photoUrl":"http://images.cn/upload/2017/10/25/20171025171830-8852e6be.png"}
,{"activityName":"高考志愿填报讲座","activityUrl":"http://wenzhangurl.cn/96","photoUrl":"http://images.cn/upload/2017/10/26/20171026101927-8be273c1.png"}]
html部分
<div id="owl-demolpo" class="owl-carousel rementuijian"> </div>
完成效果

参考页面:http://demo.lanrenzhijia.com/2013/pic1201/demos/customJson.html
标签:data style href demo arp src omd ons cti
原文地址:http://www.cnblogs.com/php0916/p/7911439.html