JQuery добавить HTML со ссылкой на JavaScript

Question

У меня есть ситуация, когда я должен добавить HTML с JQuery. В этом html есть a-тег с 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

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

Однако рассмотрите возможность применения хандера одновременно с добавлением 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 3

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

$(".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 4

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

$('.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;
          })
      )
  );

В любом случае это легче прочитать, имхо.