jQuery用JavaScript链接附加HTML

Question

我有一种情况，我应该用jQuery附加HTML。 在此html中，有一个带有javascript链接的a-tag。

我该如何解决？

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

反正这更容易理解意图，恕我直言。