Question

问题是当我在输入框中写入注释后按Enter键时，消息被发送到数据库，然后通过Ajax调用检索。

每一件事都很顺利，当我没有聚焦输入字段然后再次聚焦并开始输入新消息并按Enter键然后消息被发送两次，如果我再次这样做，消息将被发送3次，依此类推。代码有什么问题？我该如何解决这个问题？

$(".type_comment").click(function(){
        container = $(this);

        if ($(this).val() == "Type a comment.")
        {
                    $(this).val("");
                    $(this).css({ 'font-size':'13px','opacity':'1' });          
        }
        nr_crt = container.attr("nr_crt");
        container.keyup(function(e)
            {
                code = (e.keyCode ? e.keyCode : e.which);
                if (code == 13)
                    {
                            var chatmsg = container.val();
                            var comment_id = $("#main-photo"+nr_crt).attr("commentid");
                            var name = <?php echo json_encode($_SESSION['username']); ?>;
                            $.post('../utility/postcomment.php', { comment: chatmsg, name: name, comment_id: comment_id } , 
                                function(output) {
                                });
                            code = null;
                            chatmsg = "";
                            container.val("");
                            var time = setTimeout(function(){
                            $.post('../utility/fetchcomments.php', { comment_id : comment_id , name : name} , 
                                function(results) {
                                    $(".comment_append"+nr_crt).append(results);
                                });
                            clearTimeout(time);
                            },500);
                    }
            });


    });

Answer 1

$(".type_comment").click(function(){
    ...
    container.keyup(function(e){

每次单击它时，

都会将新的keyUp处理程序附加到同一个包含器。也许您希望每个新处理程序一次触发，然后再重新连接？虽然它可能不被认为是最干净的解决方案，jQuery supports exactly that：

$(".type_comment").click(function(){
    ...
    container.one('keyup', function(e){

但是，根据您的描述，很可能这就是您想要的：

$(".type_comment").each(function(){
    var container = $(this);
    var nr_crt = container.attr("nr_crt");
    ...
    container.click(...);
    container.keyup(...);
}

Answer 2

尝试将超时设置为0而不是500.这会将其移至列表的底部，但不会给予时间来缓存更多的输入键。

取消之前的按键事件

2 个答案: