点击按钮加载更多(js)

迈不过友情╰ 2024-04-19 12:20 67阅读 0赞

/*初始化*/
    var counter = 0; /*计数器*/
    var pageStart = 0; /*offset*/
    var pageSize = 5; /*size*/
    
    /*获取地址栏id*/
    var id = getUrlSearch("id");
    
    /*首次加载*/
    getData(pageStart, pageSize, id);
    
    /*点击加载更多*/
    function loading() {
    	counter++;
    	pageStart = counter * pageSize;
    	getData(pageStart, pageSize, id);
    }
    
    /*请求接口渲染数据*/
    function getData(offset, size, id) {
    	$.post(U('api/Inventory/get_shelf_one_api'), {
    		'id': id,
    	}, function(data) {
    		console.log(data);
    		var data = data.introduce;
    		var sum = data.length;
    		var result = '';
    
    		if(sum - offset < size) {
    			size = sum - offset;
    		}
    
    		/*使用for循环模拟SQL里的limit(offset,size)*/
    		for(var i = offset; i < (offset + size); i++) {
    			result += '<tr>' +
    				'<td style="text-align: center;">' + data[i].brand + '</td>' +
    				'<td>' + data[i].car_type + '</td>' +
    				'</tr>';
    		}
    
    		$('.floated_list').append(result);
    
    		/*隐藏more按钮*/
    		if((offset + size) >= sum) {
    			$(".loading").hide();
    		} else {
    			$(".loading").show();
    		}
    	})
    }
    
    //获取url多个参数
    function getUrlSearch(name) {
    	// 未传参，返回空
    	if(!name) return null;
    	// 查询参数：先通过search取值，如果取不到就通过hash来取
    	var after = window.location.search;
    	after = after.substr(1) || window.location.hash.split('?')[1];
    	// 地址栏URL没有查询参数，返回空
    	if(!after) return null;
    	// 如果查询参数中没有"name"，返回空
    	if(after.indexOf(name) === -1) return null;
    	var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
    	// 当地址栏参数存在中文时，需要解码，不然会乱码
    	var r = decodeURI(after).match(reg);
    	// 如果url中"name"没有值，返回空
    	if(!r) return null;
    
    	return r[2];
    }