CODEWITHSUNDEEP
htmlmobilesafarimobile-safari
El Fuser
El Fuser

Reputation: 441

Is there a way to avoid displaying the keyboard in mobile safari

For instance if I have

<input type="text" id="myid">

and I am using the ipad, when i focus in this input, the ipad would automatically display the keyboard. Is there a way to avoid that? Thanks

Upvotes: 6

Views: 9912

Answers (3)

BeWarned
BeWarned

Reputation: 2338

Don’t let the focus go to that field. Use an event handler to prevent the default behavior. The event handler would look something like this:

function onFocus(e) {
    e.preventDefault();
    // you could change the color of the field to indicate this is the active field.
}

Your table handling code could populate this field without the browser ever focusing on it.

Upvotes: 2

Jonas Stawski
Jonas Stawski

Reputation: 6752

Yes, simply make the element readonly

<input type="text" id="myid" readonly="readonly" />

Note that this doesn't work with the element. I believe it might be a bug.

Upvotes: 12

Richard Rodger
Richard Rodger

Reputation: 31

The best solution I have found is to position an invisible div over the textarea. This prevents the textarea from receiving touch events and this prevents the keyboard from appearing. Capture events on the div, and if you want to make the textarea editable call .focus() on it, and that will pop the keyboard up.

Using event.preventDefault does not work very well. It causes the screen to "hop" as the keyboard appears and then disappears right away.

Upvotes: 3

Related Questions