jquery - jQuery没有注册点击

Question

我遇到的问题是我可以单击我的元素开始并且一切都相应地工作，但是在我按 S 键从 textarea->paragraph 更改我的元素后，我不能再单击并且没有单击注册。

$(document).ready(function() {
    $('#dynamic').click(function() {
        log('`Clicked`');
        var text = $('#dynamic').text();
        $('#dynamic').replaceWith('<textarea id="dynamic">' + text + '</textarea>');
    });

    $(document).keydown(function(e) {
        log(e.which);
        switch(e.which) {
            // S key
            case 83:
                if ($('#dynamic').is('textarea')) {
                    var text = $('#dynamic').val();
                    $('#dynamic').replaceWith('<p id="dynamic">' + text + '</p>');
                }
                break;
            default: return;
        }
        e.preventDefault();
    });
});

这是我正在使用的代码，它注册了第一次点击，而不是元素转换后的第二次点击。:)

Answer 1

返回的元素$('#dynamic')不再存在。您必须使用事件委托来绑定事件处理程序：

$(document).on('click', '#dynamic', function() {
    ...
});

Answer 2

当您替换原始元素时，它会消失- 以及直接绑定到它的任何处理程序。您可以在重新创建处理程序时再次重新绑定处理程序，或者您可以使用委托事件处理程序，在这种情况下，您可能需要添加一个关于元素是否已经是 textarea 的测试：

$(document).on('click', '#dynamic', function() {
    if (this.tagName === "TEXTAREA") return; // already a textarea, so no action needed
    log('`Clicked`');
    var text = $('#dynamic').text();
    $('#dynamic').replaceWith('<textarea id="dynamic">' + text + '</textarea>');
});