如何使用jQuery的replaceWith（）函数使href链接触发函数？

Question

这是我尝试过的：

HTML：

<div id="container">
  <p>a paragraph</p>
</div>
<button>replace with link</button>

脚本：

$(document).ready(function() {

     $("a.foo").click(function() {
        alert('hello world');
     });

     function foo() {
        alert('hello world');
     }

     $("button").click(function () {
        // neither of these work
        // $("#container p").replaceWith('<p><a href="#" class="foo" >trigger function<\/a><\/p>');
        // $("#container p").replaceWith('<p><a href="#" onclick="foo();return false" >trigger function<\/a><\/p>');
     });

});

Answer 1

我认为您正在寻找live。

http://docs.jquery.com/Events/live

替换此

$("a.foo").click(function() {
        alert('hello world');
});

与

$("a.foo").live('click', function() {
        alert('hello world');
});

并替换

$("#container p").replaceWith('<p><a href="#" class="foo" >trigger function<\/a><\/p>');

Answer 2

您为什么使用.replaceWith()？您所需要的只是.html()：

$("button").click(function() {
  $("#container p").html('<p><a href="#" class="foo" >trigger function</a></p>');
});

Answer 3

始终记住链接元素的href =“＃”会导致回发，并且click事件可能无法正常工作。在实时事件上单击，确保阻止生成该默认操作。

$(".lnkLike").live("click", function (e){
   e.preventDefault();
});