Que dois-je faire si le clavier virtuel HTML5 apparaît et bloque la zone de saisie ?

Cet article présente principalement la solution au problème selon lequel le clavier virtuel HTML5 bloque la zone de saisie. Il a une très bonne valeur de référence. Jetons-y un coup d'œil avec l'éditeur. J'espère que cela pourra aider tout le monde.

Sans plus attendre, veuillez jeter un œil au code :

//防止键盘把当前输入框给挡住
$$('input[type="text"],textarea').on('click', function () {
  var target = this;
  setTimeout(function(){
        target.scrollIntoViewIfNeeded();
   },100);
});

Applicable à certains modèles Android.

if(/Android [4-6]/.test(navigator.appVersion)) {
    window.addEventListener("resize", function() {
        if(document.activeElement.tagName=="INPUT" || document.activeElement.tagName=="TEXTAREA") {
            window.setTimeout(function() {
document.activeElement.scrollIntoViewIfNeeded();
            },0);
        }
    })
}

Recommandations associées :
Clavier virtuel, la douleur du développement Web mobile_html/css_WEB-ITnose

Créer une personnalisation Le puissant Clavier virtuel Jquery (VirtualKeyboard)_jquery

jquery implémente la page effets de clavier virtuel_jquery

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!