I'm doing a search bar that gives results (similar to an autocomplete) but on iOS' Safari it doesn't loses focus when tapping outside of the input tag when the keyboard is open.
I did a simple jsfiddle to demonstrate the minimal code that reproduces this issue:
https://jsfiddle.net/coppolaemilio/0bqrLcwe/4/
HTML
<input class="selector" type="text">
<ul>
<li>element</li>
</ul>
JS (jQuery)
$('.selector').focus(function() {
$('ul').addClass('visible');
});
$('.selector').focusout(function() {
$('ul').removeClass('visible');
});
CSS
.selector{
margin: 20px;
}
ul {
display: none;
}
ul.visible {
display: block;
}
I managed to find a solution by using this:
$(document).on('touchstart', function (event) {
if (!$(event.target).closest('.country-selector').length) {
if ($('.country-selector').is(":visible")) {
$('input.country-selector').blur();
}
}
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.