jQuery内联编辑返回键

时间:2014-03-25 09:44:33

标签: javascript jquery

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

但是当用户点击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被击中,我怎样才能做出上述反应?

3 个答案:

答案 0 :(得分:1)

您需要检测输入按下并在模糊功能中执行相同的操作。将以下内容添加到您的js中。 Demo

    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();
        }
    });

答案 1 :(得分:0)

当在输入中按下回车键时应该触发:

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

答案 2 :(得分:0)

你可以在keydown上调用相同的函数并检查e.keyCode是否输入键是13 ..一个小提琴会有帮助..

同时检查此link

谢谢, Hardik