用于加载联系人的Phonegap Jquery Pagination - 当用户到达最后一页时如何动态添加页面？

Question

我有一个特定的场景，我将需要使用分页。

在从Android联系人加载时的Phonegap中，当用户浏览页面时，当用户点击分页中的最后一页时，我希望将另一组联系人列表动态加载到添加到现有分页的新页面集中。

我这样做是因为我必须加载超过1000个联系人的列表，我不想在初始镜头上加载 - 即使它只是分页。

我找到了动态创建页面的链接，但没有一个具有我的特定要求（当用户到达最后一页时将新列表加载到新页面中）。

这个链接jQuery pagination with dynamic <li>是我到目前为止找到的最好的链接，但我仍然需要一种方法来确定用户是否已经到达最后一页，在分页中。

注意：这不是一个ajax请求，它是一个电话间隙api，它从本机android联系人获取联系人，我必须手动迭代对象并动态创建列表。

此外，由于默认使用分页插件时的分页按钮，我不知道如何向这些页面按钮添加事件或调整它们。

我的代码片段：

navigator.contacts.find(filter, onSuccess, onError, options);

function onSuccess(contacts) {
    var html = "";
    for (var i = 0; i < contacts.length; i++) {
    if ($.trim(contacts[i].displayName).length != 0 || $.trim(contacts[i].nickName).length != 0) {
        html += '<li>';
        html += '<h2>' + contacts[i].displayName ? contacts[i].displayName : contacts[i].nickName + '</h2>';
        if (contacts[i].phoneNumbers) {
            html += '<ul class="innerlsv" data-role="listview" data-inset="true">';
            html += '<li><h3>Phone Numbers</h3></li>';
            for (var j = 0; j < contacts[i].phoneNumbers.length; j++) { var dialPadVar = '#main-wrapper'; 
                html += "<li onclick=\"contactAppendNumber('"+contacts[i].phoneNumbers[j].value+"');changePage('#main-wrapper');\">Type: " + contacts[i].phoneNumbers[j].type + "<br/>" +
                    "Value: " + contacts[i].phoneNumbers[j].value + "<br/>" +
                    "Preferred: " + contacts[i].phoneNumbers[j].pref + "</li>";
            }
            html += "</ul>";
        }
        html += '</li>';
    }
}
if (contacts.length === 0) {
    html = '<li data-role="collapsible" data-iconpos="right" data-shadow="false" data-corners="false">';
    html += '<h2>No Contacts</h2>';
    html += '<label>No Contacts Listed</label>';
    html += '</li>';
}
$("#contactsList").html(html);
$("#contactsList").listview().listview('refresh');
$(".innerlsv").listview().listview('refresh');

}

Answer 1

之前我遇到了你的问题 - 典型的navigation.contacts.find()返回所有当前的联系人，而且它超过1000.而且filter参数对分页不好。

在我获得联系人数组之后，我将它们分成页面（每页50个），但实际上所有联系人都已加载。

我认为最好的方法是优化PhoneGap API以允许抵消和限制返回的联系人。一种解决方法可能是第一次加载联系人并在之后自己管理（例如，将记录写入本地sqlite）。

对于jQuery插件，如果我正在使用它，我只需要使用工具（例如，Chrome）来观察分页按钮IDs或class names并在$(document).ready()上添加一个监听器。

如果你的意思是按钮没有在开头呈现，所以你不能自己绑定监听器，你可能需要$(document).on('click','button.pagination', function(){...});，它询问父节点（这里我直接使用文档）充当事件的代理。 'button.pagination'是动态生成的分页按钮（在您的情况下更改为正确的元素）。

Answer 2

然而，为了实现本机速度，我使用插件来调用Android的本机联系人应用程序

如果有人遇到我的问题，他们可以使用此方法，因为它可以在设备上提供最佳性能。

参考链接

How to implement contacts filter in android phonegap?

https://github.com/hazemhagrass/ContactPicker