Jquery: добавить код с помощью .append и заставить его работать в .each в jquery - PullRequest
Новая
       27

Jquery: добавить код с помощью .append и заставить его работать в .each в jquery

0 голосов
/ 18 февраля 2012

Это то, что я хочу сделать 

<ul>
   <li> <a href="#" alt="1"> User1 </a>
   <li> <a href="#" alt="2"> User2 </a> 
</ul>

<div id="chat_rooms">

  <div id='pvt0' class='pvtroom' page='room.php?id=0'><span>Chating With Default</span>
      Here Is chat words
 </div>

</div>

я делаю это, когда пользователь нажимает на ul make chat room, добавленный в #chat_rooms Используя этот код 

$('ul li a').live("click",function(){
       var uid = $(this).attr("alt");
       var uname = $(this).text();
       $("#chat_rooms").append("<div id='pvt"+uid+"' class='pvtroom' page='room.php?id="+uid+"'> <span> Chating With "+ uname`enter code here` +" </span> </div>");
});

и у меня есть этофункция уже работает 

  $('.pvtroom').each(function(){
         // my ajax request to room here
         $(this).css("border","1px solid #f00");
  });

Вот моя проблема, если я нажму на пользователя, чтобы поговорить с ним, моя комната появится, но не будет использовать эффект каждой комнаты как комнаты по умолчанию, которую я хочу, если пользователь нажмет налюбой номер комнаты работает напрямую с каждым запросом и получает результат из базы данных

1 Ответ

1 голос
/ 18 февраля 2012

Нельзя сделать так, чтобы код в each применялся к элементам, которые еще не существуют, когда код выполняется.

Поместите этот код в функцию, чтобы вы могли использовать его: 

function initChatRoom(room) {
  // my ajax request to room here
  room.css("border","1px solid #f00");
}

$('.pvtroom').each(function(){
  initChatRoom($(this));
});

Теперь используйте его, когда добавляете комнату: 

$('ul li a').live("click",function(){
  var uid = $(this).attr("alt");
  var uname = $(this).text();
  var room =
    $("<div/>", { id: 'pvt'+uid, 'class': 'pvtroom', page: 'room.php?id='+uid })
    .append($("<span/>").text('Chatting With '+ uname));
  $("#chat_rooms").append(room);
  initChatRoom(room);
});
...