Question

这是我的完整代码：

$('input').keypress(function(e){
    var code = e.keyCode || e.which,
    value    = $(this).val()

    if (code==13 && value!=''){
        $('.with-header').show()

        var secondaryContent = 'secondary-content',
        materialIcons        = 'material-icons',
        conllectiontItem     = 'collection-item'

        $('ul').append('<li class='+conllectiontItem+'>\
            <span class="words">'+value+'</span>\
            <span href="#" class='+secondaryContent+'>\
            <a class="'+materialIcons+' done">done</a>\
            <a class="'+materialIcons+' delete">delete</a>\
            <a class="'+materialIcons+' edit">edit</a>\
            </span></li>')

        //this to empty input
        $(this).val('')
    }
})

$('body').on('click', '.done', function(){
    $(this).parents('.collection-item').toggleClass('lineThrough')
})

$('body').on('click', '.edit', function(){
    var edit = $(this).parent().prev().html('<input class="listInput">')
})

$('body').on('click', '.delete', function(){
    $(this).parents('.collection-item').remove()
})

$('body').on('keypress','.listInput', function(e){
    var code = e.keyCode || e.which,
    value    = $(this).val()

    if (code==13 && value!=''){
        $(this).parent().html(value)
    }
})

对不起，我还是初学者，并且我使用了物化css框架，因此附加起来有点复杂。

我要做的是点击列表＆＃39; .edit＆＃39;我想将自动对焦放入附加<input>的列表中，但自动对焦只能工作一次。我猜是因为我为每个＆.39.Input＆＃39;都设置了自动对焦功能。

所以在我添加html输入后，我完成了编辑列表，我想尝试删除自动对焦＆＃39;来自＆＃39; .listInput＆＃39;但我不知道怎么做？

你可以帮我解决这个问题吗？或者你有其他解决方案吗？感谢

Answer 1

那么，在这种情况下尝试：

$('body').on('click', '.edit', function(){        
  $toEdit = $(this).parent().prev();
  $toEdit.html('<input class="listInput">')
  $toEdit.focus();
});

Answer 2

您可以使用blur（）函数从元素中删除焦点。

例如，要删除对代码下方所有文本框的使用。您可以在不同的场景中使用它。

$(function()

   $('input').blur();

  });

删除html自动对焦使用javascript / jquery

2 个答案: