我在.NET / jQuery项目中使用bootpag jQuery分页插件。在我的项目中,我有一个过滤菜单。当用户单击过滤选项之一时,我对服务器运行Ajax调用,该服务器使用新的过滤/分页数据更新页面。
我在返回所调用的ajax之后,立即在“ .done” ajax函数中初始化bootpag。
这是bootpag代码
$.ajax({
// some ajax call data info here to get the filtered results
}).done(function(data){
$("#paging").bootpag({
total: (data.totalResults / CONST_RESULTS_PER_PAGE) + 1
}).on('page', function (event, num) {
updateListWithFilteredResults(num);
});
});
问题是,当bootpag检测到页面单击时,它将运行包含我所讲的带有相同代码的ajax调用的相同函数(正如我所说的那样)。它导致“页面”事件被绑定多次。因此,当我第三次单击页面时,它将运行on page事件三次,依此类推。
我需要在ajax调用之后初始化bootpag,因为这是我得到总结果的地方,我用它来初始化bootpag插件(以及其他一些数据,但是总页数是init bootpag的最重要属性)。
如何解决此问题,并且仅使事件运行一次?我更喜欢非骇客的解决方案。谢谢。
最佳答案
但是,它与bootpag无关。正如您提到的页面初始化和重复的用户操作一样,在两种情况下对ajax请求的处理应该有所不同。
function refreshData() {
return $.ajax({
// some ajax call data info here to get the filtered results
}).then(function (data) {
return $("#paging").bootpag({
total: (data.totalResults / CONST_RESULTS_PER_PAGE) + 1
});
});
}
//on init of page do
refreshData().then(function (bootpag) {
bootpag.on('page', function (event, num) {
updateListWithFilteredResults(num);
});
});
//on user click just
refreshData();