iPhone focus zoom issue

by Sreeraj Saseendran

HTML

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<input type="text" id="search" />
<input type="button" id="asdf" value="clcik" />

JavaScript

jQuery('#asdf').on("click",function(){

let iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);
            if(iOS) {
 // create invisible dummy input to receive the focus first
  const fakeInput = document.createElement('input')
  fakeInput.setAttribute('type', 'text')
  fakeInput.style.position = 'absolute'
  fakeInput.style.opacity =0
  fakeInput.style.height = 0
  fakeInput.style.fontSize = '16px' // disable auto zoom

  // you may need to append to another element depending on the browser's auto 
  // zoom/scroll behavior
  document.body.prepend(fakeInput)

  // focus so that subsequent async focus will work
  fakeInput.focus()
  //debugger;

  setTimeout(() => {

    // now we can focus on the target input
    jQuery('#search').focus()

    // cleanup
    fakeInput.remove()

  }, 500)
  } else {
   jQuery('#search').focus()
  alert('false');
  }
});