使用jquery替换后，Menu元素不起作用

Question

大家好，我有点困惑。我正在使用jQuery中的replaceWith();替换元素，它运行良好。但是在转换之后，可点击元素不再起作用。这是我的code

Answer 1

这是因为替换元素时事件绑定会丢失。 replaceWith()基本上删除了元素及其所有事件绑定，然后用新元素替换它。它不会持久存在事件绑定。

使用.on()绑定点击事件。

$('.menu').on('click', 'a', function() {
   ...
});

更新小提琴：http://jsfiddle.net/RTPhR/1/

Answer 2

http://jsfiddle.net/RTPhR/5/ 将事件绑定到菜单而不是LINKS。

$(document).ready(function() {
    $('.menu').on('click','a',function() {
        var $this = $(this),
            element = $this.attr('name');

        if (element == 'opt1') {
            alert('opcion 1');

        } else if (element == 'opt2') {
            alert('opcion 2');
            $this.replaceWith("<a href='#' name='cerrar'>VOLVER</a>");

        } else if (element == 'cerrar') {
            alert('close!');
        }
    });
});