Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Actually, guys, there is a way. I struggled mightily to figure this out for <a href="http://forstartersapp.com">http://forstartersapp.com</a> (try it on an iPhone or iPad).</p> <p>Basically, Safari on touchscreen devices is stingy when it comes to <code>focus()</code>ing textboxes. Even some desktop browsers do better if you do <code>click().focus()</code>. But the designers of Safari on touchscreen devices realized it's annoying to users when the keyboard keeps coming up, so they made the focus appear only on the following conditions:</p> <p>1) The user clicked somewhere and <code>focus()</code> was called while executing the click event. If you are doing an AJAX call, then you <em>must</em> do it synchronously, such as with the deprecated (but still available) <code>$.ajax({async:false})</code> option in jQuery.</p> <p>2) Furthermore -- and this one kept me busy for a while -- <code>focus()</code> still doesn't seem to work if some other textbox is focused at the time. I had a "Go" button which did the AJAX, so I tried blurring the textbox on the <code>touchstart</code> event of the Go button, but that just made the keyboard disappear and moved the viewport before I had a chance to complete the click on the Go button. Finally I tried blurring the textbox on the <code>touchend</code> event of the Go button, and this worked like a charm!</p> <p>When you put #1 and #2 together, you get a magical result that will set your login forms apart from all the crappy web login forms, by placing the focus in your password fields, and make them feel more native. Enjoy! :)</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload