Heim > Web-Frontend > H5-Tutorial > Hauptteil

Ausführliche Erklärung, wie man in H5 eine Sprachfunktion zum Eingabefeld hinzufügt

Y2J
Freigeben: 2017-05-22 13:58:49
Original
5299 Leute haben es durchsucht

In diesem Artikel wird erläutert, wie Sie mit HTML5 eine Spracheingabefunktion zum Eingabefeld hinzufügen. Freunde, die sie benötigen, können sich auf diesen Artikel beziehen.

Hier sind die leistungsstarken HTML-Funktionen, die Sie verwenden können Wird in Zukunft die Sprachfunktion direkt zum Eingabefeld hinzufügen. Schauen wir uns zunächst die Implementierungsmethode an.

Sie können das Mikrofonsymbol auf der rechten Seite des Eingabefelds sehen. Klicken Sie auf das Mikrofon, um die Spracherkennung durchzuführen.

Tatsächlich ist die Spracherkennung eine Grundfunktion von HTML5. Ihre Verwendung ist

<input type=”text” speech x-webkit-speech />
Nach dem Login kopieren

Wenn Sie XHTML mögen Syntax, man kann es so ausdrücken

<input type=”text” x-webkit-speech=”x-webkit-speech” />
Nach dem Login kopieren

Spracherkennung war vor zehn Jahren etwas Unglaubliches. Noch vor ein paar Jahren konnte Spracherkennung auf Webseiten nur mit anderen Methoden erreicht werden, beispielsweise mit Flashplayer und so weiter. Um die Stimme zu erhalten, müssen Sie nun nur noch ein -Attribut-Tag zum Eingabefeld hinzufügen, und schon kann sie erkannt werden.

Mobile Geräte wie Browser auf Mobiltelefonen sollten auch die Spracherkennung unterstützen, sofern sie HTML5 unterstützen. Versuchen Sie, diese Seite auf Ihrem Android zu durchsuchen?

Wenn Sie außerdem Javascript verwenden möchten, um das Ende des Spracherkennungsereignisses zu erhalten , können Sie onwebkitspeechchange

<input type=”text” speech x-webkit-speech onwebkitspeechchange=”alert(this.value)” />
Nach dem Login kopieren

verwenden [Verwandte Empfehlungen]

1. Kostenloses HTML5-Video-Tutorial

2. Was soll ich tun, wenn das Eingabefeld beim Erstellen einer virtuellen Tastatur in H5 blockiert ist? ?

3.

Detaillierte Erläuterung der Methode zur Implementierung der Vollbildwiedergabe auf WeChat in HTML5

4.

Detaillierte Erläuterung der Browserkompatibilitätsprobleme mit Neue H5-Tags

5. Erfahren Sie anhand eines detaillierten Beispiels, wie Sie mit H5 die aktuelle URL ohne Aktualisierung ändern können

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung, wie man in H5 eine Sprachfunktion zum Eingabefeld hinzufügt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!