Question

我正在开发一个Phonegap应用，我在其中访问设备的联系人。然后我在window.localStorage中存储最多10个联系人。为此，当用户选择一个按钮时，我创建一个包含三个元素的div。

图像（代表男/女接触的联系人图标）
联系人姓名
另一张图片（代表'添加'标志，将其添加到window.localStorage）

然后我关联一个事件处理程序，它首先检查联系人是否已存在于localStorage中，然后继续添加联系人。这是代码

function checkDuplicate(somevalue)
{
    for(var i=0;i<10;i++) {
        if(window.localStorage.getItem(i)!=null) {
            if(window.localStorage.getItem(i)==somevalue) {
                navigator.notification.alert('Entry exists at Button:'+i);
                return false;
            }
        }
    }
    //chosenButton is a global variable
    window.localStorage.setItem(chosenButton,somevalue);
    document.getElementById('contactNumberField').textContent=somevalue;
}

//Problem is with the event listener attached to span2. Please read below

function addContact(item)
{
    var parentDiv = document.getElementById('thelist');
    var childDiv = document.createElement('li');
    var span1 = document.createElement('span');
    span1.style.float='left';
    span1.innerHTML = "<img src='keypad-contact.png'/>";
    var span2 = document.createElement('span');
    span2.style.float='right';
    span2.innerHTML="<img src='keypad-addcontact.png'/>";
    span2.addEventListener('click',function({checkDuplicate(item.number);},false);
    childDiv.textContent=item.name;
    childDiv.style.color='white';
    childDiv.appendChild(span1);
    childDiv.appendChild(span2);
    parentDiv.appendChild(childDiv);    
}

function onSuccess(contacts)
{
    var objArray = new Array();
    for(var i=0; i<contacts.length;i++) {
        var tempObj = new Object();
        tempObj['name']=contacts[i].displayName;
        tempObj['number']=contacts[i].phoneNumbers[0].value;
        objArray.push(tempObj);                 
    }
    objArray.sort(
    function(a,b){
        var nameA = a.name.toLowerCase(),nameB=b.name.toLowerCase();
        if(nameA < nameB) return -1;
        else if(nameA > nameB) return 1;
        return 0;
    }); 
    for(var i=0; i<objArray.length;i++) addContact(objArray[i]);
}

function onDeviceReady()
{
    var options = new ContactFindOptions();
    options.multiple=true;
    var field = ["displayName","phoneNumbers"];
    navigator.contacts.find(field, onSuccess, function(){alert('NA');}, options);
}

问题

当我尝试添加一个已存在于window.localStorage中的联系人时，对于我第一次触摸span2，我收到一个警报。如果我第二次触摸它再次尝试添加，我会收到两个警告......然后继续。问题在于与span2关联的事件处理程序。但是，我不知道如何过来这种情况。我怎样才能确保无论我按下span2多少次，我只会发出一次警报。如何在触发事件处理程序后立即将其删除？

请帮忙。感谢

Answer 1

修正：问题不在于动态添加事件处理程序。我碰巧使用iScroll（cubiq）作为我的项目，这造成了麻烦。现在我没有收到多个警报。诀窍是只声明一次全局滚动变量。

var scroller = null;

然后在函数

中

if(!scroller) scroller = new iScroll('scrollableDiv');

我希望这对于那些使用iScroll并且像我一样苦苦挣扎的人来说是一个有用的提示。

事件处理程序导致许多警报

问题

1 个答案: