CODEWITHSUNDEEP
javascriptiosipad
Marius
Marius

Reputation: 3643

How to capture the hide keyboard event on iOS using JavaScript

I need to do some resizing of the content of a web page when the hide keyboard button is pressed on an iPad virtual keyboard. Which JavaScript event is launched when the keyboard is hidden?

Upvotes: 17

Views: 34803

Answers (3)

Tristan G
Tristan G

Reputation: 1810

    window.onblur = function(e) {
      window.scrollTo(0, 1);
    };

This is my solution, which works fine, if someone pressed the "closekeyboard" for iOS 14.7 .

Upvotes: 0

mplungjan
mplungjan

Reputation: 177721

Here is a good place to start List of supported Javascript events on iPad

which leads to https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html#//apple_ref/doc/uid/TP40006511-SW5

which does not list it.

This one gives a work around iPad Web App: Detect Virtual Keyboard Using JavaScript in Safari?

Upvotes: 3

Per Quested Aronsson
Per Quested Aronsson

Reputation: 12100

You can use the focusout event. It's like blur, but bubbles. It will fire when the keyboard closes (but also in other cases, of course). In Safari and Chrome the event can only be registered with addEventListener, not with legacy methods. Here is an example I used to restore a Phonegap app after keyboard dismissal. 

 document.addEventListener('focusout', function(e) {window.scrollTo(0, 0)});

Without this snippet, the app container stayed in the up-scrolled position until page refresh.

Upvotes: 22

Related Questions