jquery - 带有模糊（）jQuery的可编辑输入文本

Question

我在使用 jquery blur() 函数时遇到问题这是代码：

<a class="quick_edit_title" s="1" u="/administrator/user-group/index/edit/1">Admin</a>
<a class="quick_edit_title" s="1" u="/administrator/user-group/index/edit/2">User</a>
<a class="quick_edit_title" s="1" u="/administrator/user-group/index/edit/3">Mod</a>

使用单击时，我正在使用带有可编辑元素的 Jquery Ajax

$(document).ready(function () {
    $('.quick_edit_title').each(function () {
        $(this).click(function () {
            var url = $(this).attr('u');
            var status = $(this).attr('s');
            var title = $(this).html();
            var old_element = this;
            var input = $("<input type='text' size='45' value='" + title.replace(/'/gi, "\\'") + "' class='input_quick_edit'/>");

            //$(this).replaceWith(input).blur(function() {
            //alert(this.value);
            //});  

        });
    });
});

当我单击可编辑时<a>。添加了元素<input/>，但是当我使用jquery的blur()功能时，我无法获取元素并在模糊时返回元素。value<input/><a>

Answer 1

尝试这样的事情：

$(document).on('click', '.quick_edit_title', function(){
    var url = $(this).attr('u');
    var status = $(this).attr('s');
    var title = $(this).html();
    var input = $("<input type='text' size='45' value='" + title.replace(/'/gi,"\\'") + "' class='input_quick_edit'/>");

    $(this).replaceWith(input); 
}).on('blur', '.input_quick_edit', function() {
    alert(this.value);
});

无需遍历.each()并为类分配单击处理程序，您只需制作类单击处理程序，替换内容并链接blur函数即可。