jquery - 为点击事件的整个主体创建 jquery 事件

Question

我在这里创建了下拉列表。单击编辑框时，它会显示菜单项。

当我选择菜单项时，菜单弹出窗口关闭。

但是一旦打开弹出项，如果我在弹出框外单击，它应该关闭该元素。我该怎么做？

fiddle :Fiddle

JS:

$('.typeahead').typeahead({
    name: 'Some name',
    local: ['Sports', 'Entertainment', 'Politics', 'Technolohy', 'Technolohy Again']
})
$('.typeahead.input-sm').siblings('input.tt-hint').addClass('hint-small');
$('.typeahead.input-lg').siblings('input.tt-hint').addClass('hint-large');

$(".typeahead").click(function () {
    var defaultval = $(".typeahead").val();
    $('.dropdown-menu').show(1200);
});


$('ul.dropdown-menu >li').on('click', function(){
    var idd = $(this).attr('id');
    var val = ($("#"+idd).text());
    alert(val);
    $(".typeahead").val(val);
    $('ul.dropdown-menu').hide(600);
});

Answer 1

只需使用模糊事件:

$(".typeahead").on('blur', function () {
    $('.dropdown-menu').hide(1200);
});

http://jsfiddle.net/RZTu5/1/