javascript - jqueryui 自动完成保持打开状态，但在单击外部时关闭

Question

我正在使用 jquery-ui 自动完成。

我希望自动完成搜索的结果列表保持打开状态当区域超出“自动完成文本输入区域”和“搜索结果列表”时关闭。

我引用了keep ui autocomplete open at all times 。

现在它保持开放状态。但不知道如何在单击外部区域时关闭它。

http://jsfiddle.net/9r3avhoe/6/

$("input").autocomplete({
    source: ["Apple", "Boy", "Cat"],
    minLength: 0,
    response: function(event, ui) {
          //console.log(ui);
        },
        select: function(event, ui) {
          addObject(ui.item.value);
          return false;
        },
        focus: function(event, ui) {
          return false;
        },
        close: function(event, ui) {
          if (!$("ul.ui-autocomplete").is(":visible")) {
            $("ul.ui-autocomplete").show();
            $( "#search" ).focus();
          }

        }
});

Answer 1

您可以使用焦点并仅触发小部件事件。

$("input").focusout(function(event) {
    $("ul.ui-autocomplete").hide();
})