Close ul list on leaving field (click or using tab on keyboard)

complete list which is as follows-

<div class="autocomplete-list1">
    <input type="text" class="addpropertyinput areaname-list-completed" name="property_areaname" id="property_areaname" placeholder="Area Name" onkeyup="autofillareaname()" maxlength="40" required />
    <ul class="areaname-list" id="property_areaname_list"></ul>
</div>
<div class="errormsg" id="errormsg9"></div>

I can get the list to be closed with clicked anywhere outside the page

$(window).click(function() {
$('#property_areaname_list').hide();
});

$('#property_areaname_list').click(function(event){
    event.stopPropagation();
});

but how to close the list if tab is pressed on keyboard, if i use blur event then it closes but any selection clicked on the list does not get selected...

Answers 1

  • use key press like..it may work

    $(document).keypress(function(e) {
      if(e.which == 9) { 
        $('#property_areaname_list').hide();
      }
    });
    

Related Articles