jQuery内联编辑返回键

Question

我有一个有效的内联编辑脚本，该脚本可让用户编辑他或她的名字。

但是当用户enter key时，它当前不会“保存”

剧本：

<span class="pageTitle" id="username">Visitor 123123981203980912 <span class="iconb" data-icon=""></span></span> 

    // Inline edit
    $.fn.inlineEdit = function(replaceWith, connectWith) {

        $(this).hover(function() {
            $(this).addClass('hover');
        }, function() {
            $(this).removeClass('hover');
        });

        $(this).click(function() {

            var elem = $(this);

            elem.hide();
            elem.after(replaceWith);
            replaceWith.focus();

            replaceWith.blur(function() {

                if ($(this).val() != "") {
                    connectWith.val($(this).val()).change();
                    elem.html($(this).val() + ' <span class="iconb" data-icon=""></span>');
                }

                $(this).remove();
                elem.show();
            });
        });
    };

    var replaceWith = $('<input name="temp" type="text" class="inlineEdit" />'),
        connectWith = $('input[name="hiddenField"]');

    $('#username').inlineEdit(replaceWith, connectWith);            

当按下enter key时，我如何使以上内容也有反应？

Answer 1

您需要检测回车，并在模糊功能中执行相同的操作。 将以下内容添加到您的js中。 演示

    replaceWith.keypress(function(e) {
        if(e.which == 13) {
            if ($(this).val() != "") {
                connectWith.val($(this).val()).change();
                elem.html($(this).val() + ' <span class="iconb" data-icon=""></span>');
            }

            $(this).remove();
            elem.show();
        }
    });

Answer 2

当在输入内部按下回车键时，这应该触发：

$('#username').live("keypress", function(e) {
        if (e.keyCode == 13) {
            // action here
        }
});

Answer 3

您可以在keydown上调用相同的功能，然后检查Enter键的e.keyCode是否为13.。小提琴会有所帮助。

还要检查此链接

谢谢，哈迪克