Js 的 Pagination插件的 callback(回调) 多次执行问题

在写后台代码时,发现的前台bug ---> 点击不同查询按钮之后,会重复的向后台发送请求,给经理说过之后很自然的交给我去处理。没办法公司就一个前端还比较忙,可我js是真的只懂一丢丢 *_*。

硬着头皮上吧:

原本的代码 获取每页数据(dataList)、数据总条数(totalPage)、总页数(page)多会发送Ajax请求,明显是不合理的,况且后台传过来的数据已经够了。修改合并代码还不算困难,不过要注意全局变量的问题。在本方法内调用另一个方法时,想要将获取的数据传过去使用,需要定义全局变量。

第二步,我发现改过之后,还是会有重复请求的问题,现在只是第一次只发送一次,再点击会重复发送(可以看下图,我的按钮分布)。期间一个好的方法时,可以一点点打桩看看效果(alert("看看此时效果");    也可以用console.log(参数名); 在浏览器 按F12 的sonsole查看),这样就会发现问题的所在,不过在哪里打桩是有技巧的,那里是关键点自己用多了就会找了。最后发现原因出在分页部分 Pagination

第三步,这个地方我耗时最长,用了好几天时间,人都抑郁了。也在网上找了原因,试了各种方法都不太行,起初我最怀疑的是 Pagination分页插件中的属性问题,想着总条数或者那个没有被刷新还是咋的,想去看看官方的Pagination插件手册文档,但是好像找到的说的也不清楚。就只好详细的分析打桩,在浏览器看现象,重复发送请求的就是分页的回调函数那一块。

最后,发现是分页的回调就好办了,此时的现象是:第一次点击正常,在点击其他按钮之后,按页数变换就不正常了,回调里边的函数会执行两次,在点一次按钮之后,就会变成三次,一直往上加。先暂很明朗了,回调里边的函数没有关闭,还处于潜伏状态,一出发分页他就给你来一次,恶心死人。

现在就是解决 在回调函数执行之后给他关掉。 其实在做这个之前我就想过去关掉回调试试,但是一查 网上有的说js人工干预关掉就是不正常的操作,我自己也是了一个关闭的方法也没效果就不再考虑了。我也不是想来个事后诸葛亮或者说 不再相信各位博友,但是也得有分辨和提取优秀的部分,最重要的是找到问题的根本原因。

我已经很清楚的明白我要去关闭回调函数,去搜索博客,幸运的找到了回调现象一直的想法,虽说和我想的解决方式不一,但是问题是一致的 下图:

 我有试了关闭回调的方法 $("#pagination").stopPagination({}),成功了。 我爆开心,啊哈哈哈。

代码呈上来:

	//分页
	$("#pagination").pagination({
		currentPage: 1,// 当前页数
		totalPage: totalPage ,// 总页数
		isShow: true,// 是否显示首尾页
		count: 5,// 显示个数
		homePageText: "«",// 首页文本
		endPageText: "»",// 尾页文本
		prevPageText: "‹",// 上一页文本
		nextPageText: "›",// 下一页文本
		callback: function(current) {
			// 回调,current(当前页数)
			$("#current1").text(current);
			//alert(current);
			getSnmp(pageOneAllData);  //用于显示数据(里边有判断,若非第一页,则会向后台发送请求)
			$("#pagination").stopPagination({}) //回调执行过之后就在进程中关掉,下次再开启,否则会潜伏着下次分页会再次执行
		}
	});

最后感悟吧,有可能一件事不同的人去做,因为各种因素会导致完成的程度和时间不一样,但是只要不放弃,用心思考其中的关键,坚持着去解决,一定会柳暗花明的;过程肯定会很不友好,但是带给我们的成就感只有自己体会。

加油,共勉。

 

 

猜你喜欢

转载自blog.csdn.net/ld_secret/article/details/89058460