如何动态地给id到phonegap中的元素?

时间:2013-09-04 09:32:53

标签: javascript html cordova

您好我正在使用phonegap进行申请,在该应用程序中,我需要显示listview中的用户列表,其中包含个人资料照片,姓名,号码和在线状态。

for (var i = 0; i < roster_items.length; i++) {
    var jid_contact=roster_items[i].getAttribute('jid');
    var name_contact=roster_items[i].getAttribute('name');
    ///  Add all the contacts to  Array
        $('#contacts-listview').append(
                                       '<a href="#" onclick="user_contactsClicked('+ i + ');">' +
                                       '</br>'+
                                       '<div id="contact_img">'+
                                       '<img id="splash" src="images/contact_default_pic.png"  />'+
                                       '<ul id="menu">'+'<li id="contact">'+name_contact+'</li>'+
                                       '<li id="status">'+jid_contact+'</li>'+'</ul>'+
                                       '<div class="pull-right"><div><img id=i class="status_img" src="images/user_online.png"  /></div>'+
                                       '<div style="margin-bottom: 10px;"><ol id="date">'+
                                       '<li>date</li>'+
                                       '<li>time</li>'+
                                       '</ol></div></div>'+
                                       '</div>'+
                                       '</br>'+
                                       '</a>'
                    );
        }

我将调用一个功能来更改特定用户的在线状态并更改图像

changeOnlineStatus_contact : function(elementPos) {
    alert(elementPos);
    if(elementPos>=0) {
        //Get current table
        document.getElementById(i).src = "images/user_offline.png";
    }
}

为此我想动态地给出img元素。请建议我。

提前致谢..

1 个答案:

答案 0 :(得分:0)

没有在图像上设置id的原因是因为你有:

"…<img id=i class=…"这意味着每张图片的ID都是“i”

如果您将其更改为:

"…<img id=\""+i+"\" class=…"然后它会使用i的值作为id属性


如果您对UI有更复杂的绑定,我建议您查看类似http://knockoutjs.com/的内容 - 这样您就可以更新基础模型,并且html会自动更新以表示它。