jQuery 按键事件在 ajax 调用后不会持续存在

Question

我正在尝试为墙上的帖子创建简单的评论系统（如Facebook墙）并且我正在使用加载更多按钮在每次单击"显示更多"按钮时显示数据库中的 10 多个帖子......对于每个帖子都有评论文本区域，要添加评论，我正在使用"输入按键功能"..

按键事件在 ajax 调用之前根据需要工作。

当用户激活加载更多帖子事件时，按键事件不再起作用，我检查了页面源代码，页面上找不到加载的帖子源代码，但此帖子出现在浏览器中！

添加评论功能：

    $(function() {
    $('.comment-form').keypress(function(event) {
        if (((event.keyCode || event.which) == 13) && !event.shiftKey) {
            // My ajax request here
                }
            });
    });

加载更多功能：

    $(function() {
        //More Button
        $('.more').live("click",function() {
            var ID = $(this).attr("id");
            if(ID) {
                $.ajax({
                    type: "POST",
                    url: "{$url}/ajax.php",
                    data: "loadmore="+ ID, 
                    cache: false,
                    success: function(html) {
                        $("#loadmore").append(html);
                    }
                });
            }
            return false;
        });
    });

.HTML：

        <div class="message">
        $Message
        </div>
        <div class="commenter">
        <textarea id="$id" class="comment-form" type="text" placeholder="Write comment..." maxlength="1000"></textarea>
        </div>

我是初学者，请帮忙:)

Answer 1

使用以下代码将所有未来的 html 与 DOM 中的当前 html 一起绑定按键事件 -

$('.comment-form').on('keypress', (function(event) {
    if (((event.keyCode || event.which) == 13) && !event.shiftKey) {
        // My ajax request here
    }
}));

Answer 2

通过 ajax 加载的 html 内容不会附加事件，它是新的。附加事件不是追溯性的。您将需要运行将事件附加到新 HTML 的函数。