Как я могу использовать функцию replaceWith () в jQuery, чтобы ссылка 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

Всегда помните, что href = "#" элемента link вызывает обратную передачу, и событие click может работать некорректно. В режиме реального времени нажмите, чтобы убедиться, что вы не можете выполнить действие по умолчанию.

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

Answer 3

Почему вы используете .replaceWith()? Все, что вам нужно, это .html():

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