jQuery append HTML с ссылкой javascript

Question

У меня есть ситуация, когда я должен добавить html с jQuery. Внутри этого html есть a-tag с javascript как ссылка.

Как я могу это решить?

$(".messages-wrapper").append('<li class="chat-wrapper"><a class="chat" href="javascript:openChat('http://domain.com/Messenger.aspx'">Chat öffnen<span></span><small>Chat öffnen</small></a></li>') 

Спасибо!

Answer 1

Вы можете избежать одиночных или двойных кавычек в строке с обратной косой чертой.

'... href="javascript:openChat(\'http...\')">...' 

Answer 2

Вы просто должны избежать апострофа в строку, используя \':

$(".messages-wrapper") 
.append('<li class="chat-wrapper"><a class="chat" href="javascript:openChat(\'http://domain.com/Messenger.aspx\'">Chat öffnen<span></span><small>Chat öffnen</small></a></li>'); 

Answer 3

Вы, вероятно, возникли проблемы из-за кавычек в строке. Одиночные кавычки рано заканчивают строку и вызывают ошибку javascript.

Учитывайте, однако, применение hander в то же самое время, когда вы добавляете html.

var link = $('<li class="chat-wrapper"><a class="chat" href="http://domain.com/Messenger.aspx">Chat öffnen<span></span><small>Chat öffnen</small></a></li>') 
      .find('a') 
      .click(function() { 
       openChat($(this).attr('href')); 
       return false; 
      }); 
link.appendTo(".messages-wrapper"); 

Answer 4

Просто используйте вложенное дополнение созданного объекта, чтобы выполнить действие click.

$('.messages-wrapper') 
    .append(
    $('<li class="chat-wrapper" />") 
     .append(
     $('<a class="chat" href="http://domain.com/Messenger.aspx"><small>Chat öffnen</small></a>') 
      .click(function(){ 
      openChat(this.href); 
      return false; 
      }) 
    ) 
);

Это легче читать намерение в любом случае, имхо.