Mam aplikację HTML5 / JavaScript (Sencha), którą spakowałem do PhoneGap do IOS w XCode. W taki czy inny sposób, chcę być w stanie słuchać na imprezach otwartych / zamkniętych klawiatury i zrób coś odpowiednio. Czy jest jakiś sposób, aby to zrobić?

13
Groppe 23 listopad 2011, 15:35

5 odpowiedzi

Najlepsza odpowiedź

Klawiatura zostanie automatycznie wywołana podczas skupienia się na textField, textla dostępu .... Możesz więc tworzyć słuchacz do Event Focus w JavaScript, który jest podobny do słuchania zdarzenia otwartego klawiatury. Możesz również użyć słuchacza Blur , aby obsłużyć klawiaturę blisko.

Dzięki.

18
heyjii 23 listopad 2011, 12:49

Spotkałem ten sam problem i myślę, że najlepszym rozwiązaniem w twoim przypadku jest użycie wtyczki telefonicznej, która wiąże zdarzenia rodzime, takie jak ten:

https://github.com/driftyco/ionic-plugins-keyboard/tree/60B803617AF49A10FF831099DB90340E5BB654C.

Działa świetnie na Androida i iOS w ten sam sposób, po prostu wiążą te wydarzenia:

window.addEventListener('native.showkeyboard', keyboardShowHandler);

window.addEventListener('native.hidekeyboard', keyboardHideHandler);
13
Nicolas 19 czerwiec 2014, 09:42

Wyzwalanie otwartego stanu jest łatwe przy użyciu zdarzenia OnClick lub Onfocus, ale na zamknięciu klawiatury Onblur zdarzenie nie jest zwolniony (ponieważ kursor pozostaje w wejściu / Textarea). Znalazłem więc rozwiązanie, wykrywając wysokość okna, która jest znacznie zmieniana na klawiaturze otwartej / zamkniętej.

Praca w nowoczesnych przeglądarkach na Androida i IOS też. DEMO: http://jsfiddle.net/QU1SABQ/3/

W razie potrzeby możesz poprawić mój kod dla urządzeń, które nie obsługują dodatku lub WNERHEIGHT - istnieją dostępne alternatywy w Internecie.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, minimal-ui">
<title>Detect keyboard opened/closed event</title>
</head>
<body>

<textarea id="txta" onclick="xfocus()" onblur="xblur()"></textarea><br>

<span id="status" style="background: yellow; width: auto;">closed</span>

<script type="text/javascript">
  function xfocus() {
    setTimeout(function() {
      height_old = window.innerHeight;
      window.addEventListener('resize', xresize);
      document.getElementById('status').innerHTML = 'opened'; // do something instead this
    }, 500);
  }
  function xresize() {
    height_new = window.innerHeight;
    var diff = Math.abs(height_old - height_new);
    var perc = Math.round((diff / height_old) * 100);
    if (perc > 50)
      xblur();
  }
  function xblur() {
    window.removeEventListener('resize', xresize);
    document.getElementById('status').innerHTML = 'closed'; // do something instead this
  }
</script>

</body>
</html>
4
mikep 17 grudzień 2014, 15:54

O ile widzę, że jest to możliwe tylko w systemie Android na budowę telefonu PhoneGap, zobacz żądanie pull: https://github.com/phoneGap/phoneGap-android/issues/94.

Wydarzenia nazywa się hidekeyboard i showkeyboard. Możesz sprawdzić, czy strzelają do IOS.

1
Jan Jongboom 23 listopad 2011, 11:45

Inny potencjał (ale bardzo hacky) rozwiązanie jest oglądanie zdarzenia zmiany rozmiaru okna. Nie będzie działać dla wszystkich przypadków użytkowania, ale na smartfony nie jest tak powszechne, aby zmienić rozmiar okna, więc zdarzenia zmiany rozmiaru prawdopodobnie pochodzą z otworu klawiatury. Ten kod jest niesprawdzony, ale ilustruje ogólny pomysł:

let fullWindowHeight = window.innerHeight;
let keyboardIsProbablyOpen = false;

window.addEventListener("resize", function() {
  if(window.innerHeight == fullWindowHeight) {
    keyboardIsProbablyOpen = false;
  } else if(window.innerHeight < fullWindowHeight*0.9) {
    keyboardIsProbablyOpen = true;
  }
});

Może być pomocny w użyciu wzdłuż zdarzeń ostrości / rozmycia, aby pomóc (na przykład) wykryć zamknięcie klawiatury, gdy użytkownik naciska przycisk Wstecz (jak wskazano @filipvkovic).

1
joe 14 październik 2019, 10:19