(iPhone and iPad) when clicking outside input field never loose´s focus - HTML/Javascript

Question

I have this Structure:
<div> <input type="text" name="completeName" id="completeName" value="" maxlength="50"> </div>

When clicking outside this input field on iOS (Tablet or iPhone on Safari browser), I can´t loose focus and because of that the keyboard does not hide by itself.

How can I fix this issue ? (I tested it in Android environment and it works well)

Answer 1

After a few days of searching I found the solution, if anyone will have this problem check this code:

var isAppleDevice = navigator.userAgent.match(/(iPod|iPhone|iPad)/) != null;

var inputs = jQuery("input");
if ( isAppleDevice ){
        $(document).on('touchstart','body', function (evt) {
            var targetTouches = event.targetTouches;
            if ( !inputs.is(targetTouches)){
                inputs.context.activeElement.blur();
            }
        });
    }