为什么我whichfloor的值只能获取一次

来源:5-3 标识楼层号和抵达指定楼层

CC陈十一

2019-04-26 18:35:08

$('.category-list>.dropdown').dropdown({
	css3:true,
	js:true,
	animation:'fade',
	active:'category'
}).on('dropdown-show',function(){
	loadOnce($(this),createCategoryDetails)
});

function createCategoryDetails($elem,data){
	var html='';

	for(var i=0;i<data.length;i++){
		html+='<dl class="category-details cf"><dt class="category-details-title fl"><a href="#" target="_blank" class="category-details-title-link">'+data[i].title+'</a></dt><dd class="category-details-item fl">';
		for(var j=0;j<data[i].items.length;j++){
			html+='<a href="#" target="_blank" class="link">'+data[i].items[j]+'</a>';
		}
		html+='</dd></dl>';
	}
	$elem.find('.dropdown-layer').html(html);	
}

//menu
$('.menu').dropdown({
	css3:true,
	js:true,
	animation:'fade',
	active:'menu'
});

function loadOnce($elem,success){
	var dataLoad=$elem.data('load');
	if(!dataLoad) return;
	if(!$elem.data('loaded')){
		$elem.data('loaded',true);
		$.getJSON(dataLoad).done(function(data){
			if(typeof success==='function')success($elem,data);
		}).fail(function(){
			$elem.data('loaded',false);
		});
	}
}


//header-search
var $headersearch=$('#header-search');
var html='',
	maxNum=10;
$headersearch.on('search-getData',function(e,data){
	var $this=$(this);
	html=createHeaderSearchLayer(data,maxNum);
	$this.search('appendLayer',html);
	if(html){
		$this.search('showLayer');
	}else{
		$this.search('hideLayer');
	}	
}).on('search-noData',function(e){
	$(this).search('hideLayer').search('appendLayer','');
}).on('click','.search-layer-item',function(){
	console.log('1');
		$headersearch.search('setInputVal',$(this).html());
		$headersearch.search('submit');
});
$headersearch.search({
		autocomplete:true,
		css3:true,
		js:false,
		animation:'fade'
});

function createHeaderSearchLayer(data,maxNum){
	var html='',
	    dataNum=data['result'].length;
	if(dataNum===0){
		return '';
	}
	for(var i=0;i<dataNum;i++){
		if(i>=maxNum)break;
		html+='<li class="search-layer-item">'+data['result'][i][0]+'</li>';
	}
	return html;
}

// slide

var $focusSlider=$('#slider');

$focusSlider.on('slider-show ',function(e,i,elem){

	var $img=$(elem).find('.slider-img');
	loadImg($img.data('src'),function(url){
		$img.attr('src',url);
	});
});

function loadImg(url,imgLoaded){
	var image=new Image();
	image.onload=function(){
		if(typeof imgLoaded==='function')imgLoaded(url);
	};
	setTimeout(function(){
		image.src=url;
	},1000);
	
}

$('#slider').slider({
	css3:true,
	js:false,
	animation:'slide',
	activeIndex:0,
	interval:2000
});

// floor
var $floor=$('.floor');
$floor.on('tab-show',function(e,index,elem){
})
$floor.tab({
	css3:false,
	js:false,
	event:'mouseenter',
	animation:'fade',
	activeIndex:0
});

floorData=[
	{floortop:$floor.eq(0).offset().top},
	{floortop:$floor.eq(1).offset().top},
	{floortop:$floor.eq(2).offset().top},
	{floortop:$floor.eq(3).offset().top},
	{floortop:$floor.eq(4).offset().top}
]

// floor html按需加载
var $win=$(window),
	$doc=$(document);
// function isVisible(offsetTop,height) {
//     var $win = browser.$win;
//     return ($win.height() + $win.scrollTop() > offsetTop) && ($win.scrollTop() < offsetTop + height)
// }
function timeToShow(){
	$floor.each(function(index,elem){
	if(isVisible($(elem))){
		$doc.trigger('floor-show',[index,elem])
	}
});
}
function whichFloor(){
	var num=-1;
	$floor.each(function(index,elem){
		var floordata=floorData[index];
		num=index;
		if($win.scrollTop()<floordata.floortop){
			num=index-1;
			return false;
		}
	});
	return num;
}
console.log(whichFloor());


写回答

1回答

好帮手慕慕子

2019-04-26

同学你好,老师这边测试你的代码是没有问题的, 刷新页面的时候可以获取到对应的楼层数,示例:滚动到三楼后刷新页面,打印结果:

http://img.mukewang.com/climg/5cc2e78f0001ee7505920141.jpg

whichfloor这个方法是获取当前显示在顶部的楼层数, 所以每次刷新页面的时候只会输出一次

如果帮助到你,欢迎采纳

祝学习愉快~~~

0

0 学习 · 14456 问题

查看课程