单击时将跨度转换为输入

Question

我在点击时将转换转换为输入，当在外部点击时它再次变为跨度。但它只转换一次然后不再发生

这是代码。

$(function () {
    $(document).on('click', 'span.loadNum', function () {
        var input = $('<input />', {
            'type': 'text',
                'name': 'unique',
                'value': $(this).html()
        });
        $(this).parent().append(input);
        $(this).remove();
        input.focus();
    });

    $(document).on('blur', 'input', function () {
        $(this).parent().append($('<span />').html($(this).val()));
        $(this).remove();
    });
});

跨度

<span class="loadNum">Hasha</span>
<span class="loadNum">dbhfb</span>

也可以有人告诉如何实现这一点，当我在转换后的输入标签上输入时，它应该提交一个ajax调用。

Answer 1

当您重新添加span时，它没有课程。因此span.loadNum选择器无法识别它。 Add the class：

$(this).parent().append($('<span />').addClass('loadNum').html($(this).val()));