Question

我知道这里有关于元素外部点击的广泛问题但是我无法解决我的问题。

我的菜单第二层，您可以右键单击并当前重命名列表项。您只能通过输入;

来执行此操作

$("body").on("keydown", "li.Clicked>input", function (e) {
    var inputValue = $(this).val(); 
    if(e.keyCode == 13) {
        $('ul.inbox-nav > li > ul > li.Clicked a').show();
        $("ul.inbox-nav > li > ul > li.Clicked a").text(inputValue);
        $("ul.inbox-nav > li > ul > li.Clicked input").remove();
        $("ul.inbox-nav > li > ul > li.Clicked").removeClass('Clicked');
    }
});

但是，我试图在整个菜单区域中添加一个外部点击事件，以便上述结果也会发生或重置，无论如何，但是如果没有它似乎会中断，我就无法设置任何内容。

请注意：虽然这个问题没有答案，但要查看完整工作表单中的菜单，您必须在选择重命名时按Enter键，否则.Clicked类不会被删除。

Answer 1

检查出来......

您可以为input-element添加focusout侦听器。为了使它在您的用例中工作，您必须在将input-element添加到DOM之后放置侦听器附件。当您单击其他位置或从输入字段中跳出时，焦点侦听器将触发。

$('#MailMenuSecondTier li').click(function(e) {
    if ($(this).hasClass('Rename')) {
        $('ul.inbox-nav > li > ul > li.Clicked a').hide();
        $('ul.inbox-nav > li > ul > li.Clicked').append("<input type='text' value='" + $("ul.inbox-nav > li > ul > li.Clicked a").text() + "'>");
        $('ul.inbox-nav > li > ul > li.Clicked > input').select();

        $('ul.inbox-nav > li > ul > li.Clicked > input').focusout(function(){

          var inputValue = $(this).val(); 
          $('ul.inbox-nav > li > ul > li.Clicked a').show();
          $("ul.inbox-nav > li > ul > li.Clicked a").text(inputValue);
          $(this).remove();
          $("ul.inbox-nav > li > ul > li.Clicked").removeClass('Clicked');
        })
    }
});

点击元素之外的JQuery

1 个答案: