Heim Web-Frontend H5-Tutorial Implementierungsmethode zum wiederholten Einblenden der Tastatur nach dem Klicken auf die Eingabe auf der mobilen H5-Seite

Implementierungsmethode zum wiederholten Einblenden der Tastatur nach dem Klicken auf die Eingabe auf der mobilen H5-Seite

Feb 02, 2018 pm 01:48 PM
html5 input wiederholen

In diesem Artikel erfahren Sie hauptsächlich, wie Sie der mobilen H5-Seite Canvas-Code hinzufügen. Wenn das Android-Telefon auf die Eingabe klickt, wird die Canvas-Animation wiederholt angezeigt, um die Berührung zu realisieren Beim Verschieben der Animation wird die Anweisung „createjs.Touch.enable“ hinzugefügt (stage, true, false), aber nach dem Hinzufügen dieser Anweisung sind anklickbare Ereignisse wie Eingabe und Klicken auf der Seite ungültig, sodass Touch-Ereignisse verwendet werden Implementieren Sie verwandte Funktionen wie folgt:

$('#button').on('touchstart', function() {
    window.location.href = 'xx.html'
})
Nach dem Login kopieren

Berührungsereignisse steuern die Erfassung des Fokus, damit die input Tastatur eingeblendet wird:

$('#input').on('touchstart', function() {
    $(this).focus()
})
Nach dem Login kopieren

Jedoch nach der Tastatur des Apple-Telefons Beim Schließen geht der input-Fokus automatisch verloren. Wenn Sie erneut auf die Tastatur klicken, wird ausnahmslos die Tastatur des Android-Telefons angezeigt.inputDer Fokusstatus bleibt erhalten, sodass die Tastatur nicht wiederholt angezeigt werden kann. Ursprünglich wollte ich dem Ereignis beim Schließen der Tastatur ein Fokusverlustverhalten hinzufügen, konnte dieses Ereignis jedoch nach Überprüfung der Informationen nicht finden, also habe ich einen anderen Weg gefunden: Jedes Mal, wenn ich auf input klicke, wird das ursprüngliche wird gelöscht. Und generieren Sie ein neues input und platzieren Sie es hier, damit das neue input den Fokus gewinnen und auf der Tastatur erscheinen kann. Der Implementierungscode lautet wie folgt: input

Code : html

<button id="btn"></button>
<p class="box">
    <input type="text" maxlength="4" id="hengpi"/>
</p>
Nach dem Login kopieren

Code: js

$('#btn').on('touchstart', function() {
    var value = $('input').val()
    $('input').remove()
    $('.box').html('<input type="text"/>')
    if(value!=''){
        $('input').val(value)
    }
    $('input').focus()
})
Nach dem Login kopieren
Verwandte Empfehlungen:


Analyse zum Ein- und Ausblenden der Softtastatur und Die Tastatur wird in Android nicht automatisch angezeigt


Das obige ist der detaillierte Inhalt vonImplementierungsmethode zum wiederholten Einblenden der Tastatur nach dem Klicken auf die Eingabe auf der mobilen H5-Seite. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Tabellenrahmen in HTML Tabellenrahmen in HTML Sep 04, 2024 pm 04:49 PM

Anleitung zum Tabellenrahmen in HTML. Hier besprechen wir verschiedene Möglichkeiten zum Definieren von Tabellenrändern anhand von Beispielen für den Tabellenrand in HTML.

HTML-Rand links HTML-Rand links Sep 04, 2024 pm 04:48 PM

Anleitung zum HTML-Rand links. Hier besprechen wir einen kurzen Überblick über HTML margin-left und seine Beispiele sowie seine Code-Implementierung.

Verschachtelte Tabelle in HTML Verschachtelte Tabelle in HTML Sep 04, 2024 pm 04:49 PM

Dies ist eine Anleitung für verschachtelte Tabellen in HTML. Hier diskutieren wir anhand der entsprechenden Beispiele, wie man eine Tabelle innerhalb der Tabelle erstellt.

HTML-Tabellenlayout HTML-Tabellenlayout Sep 04, 2024 pm 04:54 PM

Leitfaden zum HTML-Tabellenlayout. Hier besprechen wir die Werte des HTML-Tabellenlayouts zusammen mit den Beispielen und Ausgaben im Detail.

HTML-Eingabeplatzhalter HTML-Eingabeplatzhalter Sep 04, 2024 pm 04:54 PM

Leitfaden für HTML-Eingabeplatzhalter. Hier besprechen wir die Beispiele für HTML-Eingabeplatzhalter zusammen mit den Codes und Ausgaben.

HTML-geordnete Liste HTML-geordnete Liste Sep 04, 2024 pm 04:43 PM

Leitfaden zur HTML-geordneten Liste. Hier besprechen wir auch die Einführung von HTML-geordneten Listen und Typen sowie deren Beispiele

Text in HTML verschieben Text in HTML verschieben Sep 04, 2024 pm 04:45 PM

Anleitung zum Verschieben von Text in HTML. Hier besprechen wir eine Einführung, wie Marquee-Tags funktionieren, mit Syntax und Beispielen für die Implementierung.

HTML-Onclick-Button HTML-Onclick-Button Sep 04, 2024 pm 04:49 PM

Anleitung zum HTML-OnClick-Button. Hier diskutieren wir deren Einführung, Funktionsweise, Beispiele und Onclick-Events in verschiedenen Veranstaltungen.

See all articles