Question

我有一个html标记（在线用户列表）：

<div id="users">
   <div class="users_row" title="User1">User1</div>
   <div class="users_row" title="User2">User2</div>
   <div class="users_row" title="User3">User3</div>
   <div class="users_row" title="User4">User4</div>
</div>

我的mootools js功能如下（每5秒一次周期功能）：

      get_users: function() {                   

                new Request.JSON({
                    initialDelay: 1,
                    delay: 10000,
                    limit: 25000,
                    method: 'post',
                    url: 'handler.php', 

                        onSuccess: function(data){
                            if (data.users.length) {
                                data.users.each(function(u){
/*Wrong...*/                                    
new Element('div', {'html':u.name, 'class': 'user_row', 'title': u.name}).inject(document.id('users')); 

                                });     
                            }       
                        }
                });
        }

例如，我从handler.php获取User1，User2，User3，User5。如何重建我的在线用户列表？

 <div id="users">
       <div class="users_row" title="User1">User1</div>
       <div class="users_row" title="User2">User2</div>
       <div class="users_row" title="User3">User3</div>
       <!--<div class="users_row" title="User4">User4</div>!--> // Remove User4
       <div class="users_row" title="User5">User5</div> // Add User5
 </div>

P.S：这个答案是不可接受的：）

document.id('users').set('html', '<div class="users_row" title="'+u.name+'">'+u.name+'</div>);

感谢。

P.S：来自服务器的我的JSON示例：

{"users":[{"name":"User1"},{"name":"User2"},{"name":"User3"},{"name":"User5"}],"total":4}

Answer 1

试试这个：
查看演示 here

for (i = 0; i < users.users.length; i++) {
        var el = new Element('div', {
            'class': 'users_row',
            'html': users.users[i].name
        });
        el.inject(usersDivId);
    }

Mootools列表过滤器，定期向服务器发出请求

1 个答案: