$.ajax()和fixPagesHeight()是顺序执行的
而ajax是一个异步调用,在ajax的success方法执行前你是拿不到值的,即使你设置全局变量都是没用
$(".swiper-nav .swiper-wrapper")中的html不是你所期望的
可以在这样修改
function fixPagesHeight() {
$.ajax({
type: "get",
url: "nav.php",
cache: false,
dataType: "json",
success: function(data) {
var data = data;
var html = '';
for (var i = 0; i < data.length; i++) {
html += '
';}
$(".swiper-nav .swiper-wrapper").get(0).innerHTML = html;
var nav = $('.swiper-nav').swiper({
slidesPerView: 'auto',
freeMode: true,
noSwiping: true,
freeModeFluid: true,
calculateHeight: true,
visibilityFullFit: true,
onSlideClick: function(nav) {
pages.swipeTo(nav.clickedSlideIndex)
}
});
fixPagesHeight(nav);
},
error: function() {
alert("出错");
}
});
}
或者
$.ajax({
type: "get",
url: "nav.php",
cache: false,
dataType: "json",
success: function(data) {
var data = data;
var html = '';
for (var i = 0; i < data.length; i++) {
html += '
';}
$(".swiper-nav .swiper-wrapper").get(0).innerHTML = html;
fixPagesHeight();
},
error: function() {
alert("出错");
}
});
function fixPagesHeight(){
var nav = $('.swiper-nav').swiper({
slidesPerView: 'auto',
freeMode: true,
noSwiping: true,
freeModeFluid: true,
calculateHeight: true,
visibilityFullFit: true,
onSlideClick: function(nav) {
pages.swipeTo(nav.clickedSlideIndex)
}
});
$('.swiper-pages').css({
height: $(window).height() - nav.height - 48
})
}