Bei input keine Tastatur einblenden

[JürgenB]

Hallo,

gibt es eine Möglichkeit, beim Input-Element auf Mobilgeräten (etc.) keine Tastatur eingeblendet zu bekommen?

Ich versuche gerade recht erfolglos, mein Sudoku smartphone- und tablettauglich zu bekommen.

Gruß
Jürgen

[Matthias Apsel]

Hallo JürgenB,

gibt es eine Möglichkeit, beim Input-Element auf Mobilgeräten (etc.) keine Tastatur eingeblendet zu bekommen?

Radio oder select/option verwenden?

EDIT type=number scheint auch zielführend zu sein

Wie stelltst du dir denn so im Allgemeinen die Bedienung vor?

Bis demnächst
Matthias

[JürgenB]

Hallo Matthias,

Wie stelltst du dir denn so im Allgemeinen die Bedienung vor?

da ich ja nur Ziffern benötige, wollte ich neun Buttons unter oder neben das Spielfeld setzen, also eine einzeilige „Tastatur“.

Zusätzlich stört (bei iOS) auch noch das Zoomen auf das Eingabefeld.

Ich habe mal die aktuelle Version hochgeladen.

Gruß
Jürgen

[Matthias Apsel]

Hallo JürgenB,

da ich ja nur Ziffern benötige, wollte ich neun Buttons unter oder neben das Spielfeld setzen, also eine einzeilige „Tastatur“.

readonly könnte zielführend sein.

Bis demnächst
Matthias

[JürgenB]

Hallo

Hallo JürgenB,

da ich ja nur Ziffern benötige, wollte ich neun Buttons unter oder neben das Spielfeld setzen, also eine einzeilige „Tastatur“.

readonly könnte zielführend sein.

das unterdrückt auf dem iPhone das Einblenden der Tastatur, aber es wird leider immer noch auf das gewählte Inputelement gezoomt.

Gruß
Jürgen

PS Auf dem PC muss die Tastatureingabe jetzt über das keypress-Event erfolgen.

[Matthias Apsel]

Hallo JürgenB,

readonly könnte zielführend sein.

das unterdrückt auf dem iPhone das Einblenden der Tastatur, aber es wird leider immer noch auf das gewählte Inputelement gezoomt.

Unter Android sieht es jetzt gut aus. Leider ist das ausgewählte input-Element nicht hervorgehoben. Möglicherweise hilft gegen das Zoomen auch ein disabled.

Bis demnächst
Matthias

[Gunnar Bittersmann]

@@JürgenB

Ich habe mal die aktuelle Version hochgeladen.

Ein Sudokufeld ist nicht einfach eine 9×9-Tabelle, sondern jeweils 3 Zeilen bzw. Spalten bilden eine Gruppe (tbody bzw. colgroup).

Dann ist auch der dickere Rahmen der Gruppen einfach zu erzeugen.

Siehe mein Dabblet oder meinen Pen – da ggfs. bei „HTML“ auf [⌄] gehen, Option „View Compiled HTML“ wählen.

LLAP 🖖

[JürgenB]

Hallo Gunnar,

Ein Sudokufeld ist nicht einfach eine 9×9-Tabelle, sondern jeweils 3 Zeilen bzw. Spalten bilden eine Gruppe (tbody bzw. colgroup).

Dann ist auch der dickere Rahmen der Gruppen einfach zu erzeugen.

als ich das Sudoku vor über 10 Jahren gebastelt habe, ging es mir um den Algorithmus, das HTML war nur ein notwendiges Übel :).

Gruß
Jürgen

[Gunnar Bittersmann]

@@JürgenB

als ich das Sudoku vor über 10 Jahren gebastelt habe, ging es mir um den Algorithmus, das HTML war nur ein notwendiges Übel :).

Ich finde das nicht notwendig, dass viele Algorithmus-Bastler übles HTML schreiben.

LLAP 🖖

[JürgenB]

Hallo Gunnar,

als ich das Sudoku vor über 10 Jahren gebastelt habe, ging es mir um den Algorithmus, das HTML war nur ein notwendiges Übel :).

Ich finde das nicht notwendig, dass viele Algorithmus-Bastler übles HTML schreiben.

ich bin damals garnicht auf die Idee gekommen, das Sudoku-Linienmuster mit reinem HTML/CSS zu erzeugen. Da das Sudokufeld per JS erzeugt wird, war es für mich das naheliegendste, auch die Linienstärken per JS zu setzen.

Gruß
Jürgen

[Gunnar Bittersmann]

@@JürgenB

Ich finde das nicht notwendig, dass viele Algorithmus-Bastler übles HTML schreiben.

ich bin damals garnicht auf die Idee gekommen, das Sudoku-Linienmuster mit reinem HTML/CSS zu erzeugen. Da das Sudokufeld per JS erzeugt wird, war es für mich das naheliegendste, auch die Linienstärken per JS zu setzen.

Genau das ist meine Kritik an der Frontend-Entwicklung: Dass viele Frontend JavaScript-Entwickler gar nicht erst auf die Idee kommen, sowas profanes wie HTML und CSS einzusetzen.

Und das ist seit damals eher noch schlimmer geworden.

LLAP 🖖

[Gunnar Bittersmann]

@@JürgenB

gibt es eine Möglichkeit, beim Input-Element auf Mobilgeräten (etc.) keine Tastatur eingeblendet zu bekommen?

Ich versuche gerade recht erfolglos, mein Sudoku smartphone- und tablettauglich zu bekommen.

Wenn du keine Tastatureingabe willst, willst du keine Texteingabefelder.

Zur Auswahl eines Feldes kannst du Radiobuttons verwenden (visuell versteckt). Beim Click auf einen Button [1] bis [9] wird die Zahl ins aktuell ausgewählte Feld geschrieben; beim Click auf [C] wird gelöscht.

☞ Codepen

LLAP 🖖

[JürgenB]

Hallo Gunnar,

☞ Codepen

vielen Dank. Da muss ich jetzt nur noch sehen, wie ich das um die Tastatureingabe erweitere, aber ich vermute, das sollte auch mit dem Keypress-Event auf die Tabelle gehen.

Gruß
Jürgen

[Gunnar Bittersmann]

@@JürgenB

vielen Dank. Da muss ich jetzt nur noch sehen, wie ich das um die Tastatureingabe erweitere, aber ich vermute, das sollte auch mit dem Keypress-Event auf die Tabelle gehen.

Muss es denn immer JavaScript sein‽ Das contenteditable-Attribut existiert.

Ich hab den Pen angepasst.

Damit kann der Nutzer natürlich sonstwas eingeben. Für eine Validierung bräuchte man dann doch JavaScript. Oder Texteingabefelder.

LLAP 🖖

[JürgenB]

Hallo Gunnar,

noch mal vielen Dank.

Muss es denn immer JavaScript sein‽

da ich die Eingabe auf ihre Gültigkeit gemäß Sudokuregeln prüfe, wäre hier Javascript kein zusätzlicher Aufwand. Und da das Sudoku per JS berechnet wird, geht ohne JS sowieso nichts.

Gruß
Jürgen

[JürgenB]

Hallo @Gunnar Bittersmann,

Das contenteditable-Attribut existiert.

das funtioniert wie gewünscht: Eingabefeld ohne Tastatureinblendung. Aber ich bin etwas irritiert, da contenteditable ja eigentlich für den Fall gedacht ist, dass ich ein beliebiges Element zum Eingabeelement machen kann. Warum wird dann keine Tastatur eingeblendet?

Gruß
Jürgen

[Matthias Apsel]

Hallo JürgenB,

Das contenteditable-Attribut existiert.

das funtioniert wie gewünscht: Eingabefeld ohne Tastatureinblendung.

also contenteditable=false?

Aber ich bin etwas irritiert, da contenteditable ja eigentlich für den Fall gedacht ist, dass ich ein beliebiges Element zum Eingabeelement machen kann. Warum wird dann keine Tastatur eingeblendet?

Safari eben. Wenn du einen Löwen siehst, bekommst du auch keine Flinte. duck und weg

Bis demnächst
Matthias

[Gunnar Bittersmann]

@@Matthias Apsel

Warum wird dann keine Tastatur eingeblendet?

Safari eben.

Du machst auf den falschen Jagd.

LLAP 🖖

[JürgenB]

Hallo Matthias,

Das contenteditable-Attribut existiert.

das funtioniert wie gewünscht: Eingabefeld ohne Tastatureinblendung.

also contenteditable=false?

nein, contenteditable=true, s. Gunnars pen.

Aber ich bin etwas irritiert, da contenteditable ja eigentlich für den Fall gedacht ist, dass ich ein beliebiges Element zum Eingabeelement machen kann. Warum wird dann keine Tastatur eingeblendet?

Safari eben. Wenn du einen Löwen siehst, bekommst du auch keine Flinte. duck und weg

heist das, dass andere Geräte bei contenteditable=true doch wieder die Tastatur einblenden?

Gruß
Jürgen

[Gunnar Bittersmann]

@@JürgenB

Das contenteditable-Attribut existiert.

das funtioniert wie gewünscht: Eingabefeld ohne Tastatureinblendung.

Ah ja, das wolltest du ja so.

Aber ich bin etwas irritiert, da contenteditable ja eigentlich für den Fall gedacht ist, dass ich ein beliebiges Element zum Eingabeelement machen kann. Warum wird dann keine Tastatur eingeblendet?

Wird doch‽ Bei mir (Safari) jedenfalls. Wenn bei dir nicht, Browserbug. Magst du ein Ticket erstellen?

Und es ist wohl nicht die beste Idee, sich auf Browserbugs zu verlassen. Wenn du keine Tastatur willst, ist contenteditable doch nicht Mittel der Wahl.

LLAP 🖖

[Gunnar Bittersmann]

@@Gunnar Bittersmann

Wenn du keine Tastatur willst, ist contenteditable doch nicht Mittel der Wahl.

Eigentlich willst du ja eine Tastatur – die numerische. Siehe anderen Thread.

LLAP 🖖

[JürgenB]

Hallo Gunnar,

Eigentlich willst du ja eine Tastatur – die numerische. Siehe anderen Thread.

eigentlich doch nicht, da die eingeblendete Tastatur viel Platz einnimmt und der Browser auf das gewählte Inputelement zoomt. S. die Version mit input type="number"

Gruß
Jürgen

[JürgenB]

Hallo Gunnar,

Das contenteditable-Attribut existiert.

das funtioniert wie gewünscht: Eingabefeld ohne Tastatureinblendung.

keine Ahnung was ich da am Wochenende gemacht/gesehen habe, heute wird bei deinem pen die Tastatur eingeblendet.

Wenn du keine Tastatur willst, ist contenteditable doch nicht Mittel der Wahl.

also doch die Javascript-Variante, die dann auch gleich die Eingabe prüft.

Gruß
Jürgen

[JürgenB]

Hallo,

der erste Schritt ist vollbracht und mein Sudoku kann jetzt auch auf Geräten ohne Maus gespielt werden und passt sich an die Fenstergröße an. Lediglich das 16er Spiel benötigt auf dem Smartphone gute Augen.

Ich habe mich erst mal nur um die Steuerung und die Anpassung an die Fenstergröße gekümmert. Gunnars Idee, das Spielfeld mit den unterschiedlichen Linienstärken über Colgroups und Tbodys zu realisieren, finde ich sehr reizvoll, die Umsetzung habe ich aber für später geplant.

Daher hier noch einmal vielen Dank für die Hilfe und die Anregungen

Gruß
Jürgen

PS Die Links zeigen jetzt alle auf die neue Version.

[Gunnar Bittersmann]

@@JürgenB

Gunnars Idee, das Spielfeld mit den unterschiedlichen Linienstärken über Colgroups und Tbodys zu realisieren, finde ich sehr reizvoll

Die eigentliche Idee ist, die vorhandene Struktur (jeweils 3 Gruppen mit 3 Elementen in der Horizontalen und der Vertikalen) auch im Markup abzubilden.

Wenn man das macht, also adäquates Markup schreibt, bekommt man das Styling quasi als Geschenk obendrauf.

die Umsetzung habe ich aber für später geplant.

Das sollte einsfixdrei erledigt sein.

LLAP 🖖

[JürgenB]

Hallo Gunnar,

Gunnars Idee, das Spielfeld mit den unterschiedlichen Linienstärken über Colgroups und Tbodys zu realisieren, finde ich sehr reizvoll

Die eigentliche Idee ist, die vorhandene Struktur (jeweils 3 Gruppen mit 3 Elementen in der Horizontalen und der Vertikalen) auch im Markup abzubilden.

Wenn man das macht, also adäquates Markup schreibt, bekommt man das Styling quasi als Geschenk obendrauf.

da ich das Spielfeld per JS erzeuge (ich biete das Sudoku in drei Größen an), wird der Aufwand vergleichbar sein. Ich kann dann aber noch besser JS und CSS trennen.

die Umsetzung habe ich aber für später geplant.

Das sollte einsfixdrei erledigt sein.

da ich in diesem Umbau eher einen Vorteil für mich als Entwickler sehe, als für den Spieler, hat das etwas mehr Zeit.

Gruß
Jürgen

[Gunnar Bittersmann]

@@JürgenB

da ich das Spielfeld per JS erzeuge

Wie du das Markup (DOM) erzeugst (statitsches oder per PHP generiertes HTML, JavaScript, …), sollte keinen Einfluss darauf haben, welches Markup du erzeugst. Eher andersrum.

da ich in diesem Umbau eher einen Vorteil für mich als Entwickler sehe, als für den Spieler, hat das etwas mehr Zeit.

Assistive Technologie könnte auch die Information über die Gruppierung von Zeilen bzw. Spalten an den Nutzer weiterreichen; also Vorteil für den Nutzer.

LLAP 🖖

[Gunnar Bittersmann]

@@Gunnar Bittersmann

Die eigentliche Idee ist, die vorhandene Struktur (jeweils 3 Gruppen mit 3 Elementen in der Horizontalen und der Vertikalen) auch im Markup abzubilden.

Wenn man das macht, also adäquates Markup schreibt, bekommt man das Styling quasi als Geschenk obendrauf.

Ich will die unterschiedliche Denkweise noch mal erläutern.

Pferd von hinten aufgezäumt:

Von einer nicht weiter strukturierten 9×9-Tabelle^[1] auszugehen; bei der Frage, wie man die Linien für die Gruppen dicker bekommt, darauf kommen, aus Darstellungsgründen das Markup anzupassen und nachträglich colgroup/col und tbody einzufügen.

Übrigens bräuchte man für die Darstellung die Gruppierung im Markup nicht und auch keine Inline-Styles oder Klassen, das kriegt man auch mit Pseudoklassen :nth-child (oder :nth-of-type) hin.

Markup-first-Ansatz:

Zuerst die Struktur im Markup abbilden: Es gibt 3 Gruppen zu jeweils 3 Spalten:

    <colgroup><col/><col/><col/></colgroup>
    <colgroup><col/><col/><col/></colgroup>
    <colgroup><col/><col/><col/></colgroup>

Es gibt 3 Gruppen zu jeweils 3 Zeilen:

    <tbody><tr></tr><tr></tr><tr></tr></tbody>
    <tbody><tr></tr><tr></tr><tr></tr></tbody>
    <tbody><tr></tr><tr></tr><tr></tr></tbody>

Die trs werden dann mit jeweils 9 tds befüllt — fertig ist das Markup.

Beim Stylen merkt man dann: oh, wie gut, dass ich die colgroups und tbodys schon habe.

LLAP 🖖

---

1. 4×4, 16×16 entsprechend ↩︎

[JürgenB]

Hallo Gunnar,

du hast mich schon längst überzeugt.

Das aktuelle Markup mit den Inline-Styles sind die Reste der Version von 2005. Damals sah es weder bei den Browsern noch bei mir gut mit der CSS-Unterstützung aus.

Gruß
Jürgen

[MudGuard]

Hi,

der erste Schritt ist vollbracht und mein Sudoku kann jetzt auch auf Geräten ohne Maus gespielt werden und passt sich an die Fenstergröße an. Lediglich das 16er Spiel benötigt auf dem Smartphone gute Augen.

Aber auf Geräten mit Tastatur mag's nicht so richtig:

Ich klick in eines der Felder für die Ziffern, drücke die 8, und erhalte den Hinweis, daß nur Zahlen von 1 bis 9 eingegeben werden dürfen.

Ich klick in eines der Felder für die Notizen (sehr gutes Feature, das fehlt bei anderen Implementierungen), drücke wieder die 8, und es erscheint 56. Huch???

Zur Sicherheit klick ich in die Suchleiste des Browsers, drücke wieder die 8, und es erscheint die 8. Ok, meine Tastatur ist noch in Ordnung ...

Noch ein Versuch: wieder Klick ins Eingabefeld, ich tippe die 8 (diesmal nicht die vom Ziffernblock, sondern die über den Buchstabentasten). Und es erscheint eine 8.

Hm. Ein Eingabefeld für Ziffern, das mit dem für die Eingabe von Ziffern prädestinierten Ziffernblock der Tastatur nicht funktioniert?

Navigieren mit der Tab-Taste: leider auch nicht möglich, da die Spielfelder nicht in der Tab-Order liegen. Dafür liegen die Pseudo-Tasten unterhalb des Spielfelds in der Tab-Order. Aber wenn da eine den Focus hat, funktioniert weder Leerzeichen noch Return. Es passiert nichts.

cu,
Andreas a/k/a MudGuard

[JürgenB]

Hallo Andreas,

danke für den Test und die Rückmeldung.

Aber auf Geräten mit Tastatur mag's nicht so richtig:

Meine Testgeräte haben keinen Ziffernblock, und da ich diesen auch auf Geräten mit Ziffernblock kaum nutze, habe ich nicht dran gedacht. Da muss ich noch ran, ebenso an das Problem mit der Backspace-Taste.

Navigieren mit der Tab-Taste: leider auch nicht möglich, da die Spielfelder nicht in der Tab-Order liegen. Dafür liegen die Pseudo-Tasten unterhalb des Spielfelds in der Tab-Order. Aber wenn da eine den Focus hat, funktioniert weder Leerzeichen noch Return. Es passiert nichts.

um die Tab-Order habe ich mich nicht gekümmert, da ich garnicht auf die Idee gekommen bin, das jemand eins von über 50 Eingabefeldern mit der Tab-Taste ansteuert.

Gruß
Jürgen

[Auge]

Hallo

der erste Schritt ist vollbracht und mein Sudoku kann jetzt auch auf Geräten ohne Maus gespielt werden

… aber nicht mit dem Zifferblock.

[edit]Auch die Backspace-Taste will nicht und lässt die Seite an deren Anfang mit dem Menü zurückspringen. Leider unbenutzbar. :-([/edit]

Tschö, Auge

[JürgenB]

Hallo Auge,

danke für den Test und die Rückmeldung.

der erste Schritt ist vollbracht und mein Sudoku kann jetzt auch auf Geräten ohne Maus gespielt werden

… aber nicht mit dem Zifferblock.

habe ich auch gerade bemerkt, da muss ich noch mal ran.

[edit]Auch die Backspace-Taste will nicht und lässt die Seite an deren Anfang mit dem Menü zurückspringen. Leider unbenutzbar. :-([/edit]

aber nicht immer und nicht in allen Browsern :(

Gruß
Jürgen

[Auge]

Hallo

[edit]Auch die Backspace-Taste will nicht und lässt die Seite an deren Anfang mit dem Menü zurückspringen. Leider unbenutzbar. :-([/edit]

aber nicht immer und nicht in allen Browsern :(

Im Firefox 50 bei jedem meiner Versuche. Dabei wollte ich das Notizfeld leeren bzw. einzelne Ziffern daraus entfernen. In anderen Szenarien und Browsern mag das anders sein.

Tschö, Auge

[JürgenB]

Hallo Auge,

[edit]Auch die Backspace-Taste will nicht und lässt die Seite an deren Anfang mit dem Menü zurückspringen. Leider unbenutzbar. :-([/edit]

aber nicht immer und nicht in allen Browsern :(

Im Firefox 50 bei jedem meiner Versuche. Dabei wollte ich das Notizfeld leeren bzw. einzelne Ziffern daraus entfernen. In anderen Szenarien und Browsern mag das anders sein.

das ist irgendwie seltsam, gerade hat es einmal funktioniert, nach einem Reload dann aber nicht mehr ???.

Gruß
Jürgen

[JürgenB]

Hallo,

ich habe mal eine überarbeitete Version in meinen Testbereich hochgeladen.

Der Numblock wird jetzt unterstützt, aber das Problem mit der Backspacetaste bekomme ich nicht in den Griff. Im FF geht der Browser bei Backspace sofort in der History einen Schritt zurück. Nur wenn es die erste Seite ist, wird bei Backspace wie gewünscht das letzte Zeichen des angewählten Felds gelöscht.

Der Eventhandler sieht so aus:

document.body.onkeyup=function(e) { 
	var key = e.keyCode; 
	var wert = "";
	if(key > 48 && key < 58) wert = key-48;
	else if(key > 96 && key < 106) wert = key-96;
	console.log(key,wert,e.code);
	if(key==27) {
		var feld = document.querySelector('[name="feld"]:checked');
		if(feld) feld.checked = false;
		return true;
	}
	var feld = document.querySelector('[name="feld"]:checked + .sfeld');
	if(feld) {
		if(key==8 || key==46) feld.innerText = "";
		else feld.innerText = wert;
		check(feld);
		e.preventDefault();
		e.stopPropagation();
		return false;
	}
	feld = document.querySelector('[name="feld"]:checked + .memo');
	if(feld) {
		if(key==46) feld.innerText = "";
		else if(key==8) feld.innerText = feld.innerText.substr(0,feld.innerText.length-1);
		else feld.innerText += wert;
		e.preventDefault();
		e.stopPropagation();
		return false;
	}
	return true;
}

bei Backspace (key==8) wird der Handler mit

	e.preventDefault();
	e.stopPropagation();
	return false;

beendet.

Irgendwie sieht es so aus, als würde die Backspace-Aktion „in der History zurück“ ausgeführt, bevor mein Eventhandler greift. Gibt es da eine Möglichkeit, das zu unterbinden?

Gruß
Jürgen

[Auge]

Hallo

… das Problem mit der Backspacetaste bekomme ich nicht in den Griff. Im FF geht der Browser bei Backspace sofort in der History einen Schritt zurück. Nur wenn es die erste Seite ist, wird bei Backspace wie gewünscht das letzte Zeichen des angewählten Felds gelöscht.

Hmm, seit wann wird in Formularfeldern mit Backspace ein Sprung ind er Browserhistory ausgelöst? Wie ich jetzt aber sehe, benutzt du für die Eingabe ein span.

<td style="vertical-align: bottom; padding-bottom: 0px;">
 <label>
  <input name="feld" type="radio"><!-- display: none; -->
  <span id="X200" class="sfeld"></span>
 </label>
 <label>
  <input name="feld" type="radio"><!-- display: none; -->
  <span id="y200" class="memo"></span>
 </label>
</td>

Klar, dass da mit Backlspace keine Eingabe gelöscht wird. Es ist ja streng genommen keine da.

Irgendwie sieht es so aus, als würde die Backspace-Aktion „in der History zurück“ ausgeführt, bevor mein Eventhandler greift. Gibt es da eine Möglichkeit, das zu unterbinden?

Benutze echte Formularfelder für die Eingaben.

Tschö, Auge

[JürgenB]

Hallo Auge,

Benutze echte Formularfelder für die Eingaben.

und damit bin ich dann wieder beim Ausgangsposting. Ich habe extra auf Formularfelder verzichtet, da bei diesen auf Geräten ohne Tastatur eine virtuelle Tastatur eingeblendet wird, die dann den halben Bildschirm einnimmt.

Und auf eine Lösung, die prüft, ob zu wenig Platz ist und dann zwischen echten und „simulierten“ Inputs umschaltet, würde ich gerne verzichten.

Gruß
Jürgen

[Auge]

Hallo

Benutze echte Formularfelder für die Eingaben.

und damit bin ich dann wieder beim Ausgangsposting. Ich habe extra auf Formularfelder verzichtet, da bei diesen auf Geräten ohne Tastatur eine virtuelle Tastatur eingeblendet wird, die dann den halben Bildschirm einnimmt.

Aha. Ich frage mich, warum die Tastatur – abgesehen vom Platzbedarf – überhaupt ein Problem darstellt. Der Platzbedarf ist mMn ein kosmetisches Problem und zudem gehe ich heutzutage davon aus, dass mir eine Tastatur zur Eingabe bereitgestellt wird. Hier wäre es mit type="number" sogar die richtige Tastatur.

Und auf eine Lösung, die prüft, ob zu wenig Platz ist und dann zwischen echten und „simulierten“ Inputs umschaltet, würde ich gerne verzichten.

Das wiederum ist verständlich.

Tschö, Auge

[JürgenB]

Hallo Auge,

Aha. Ich frage mich, warum die Tastatur – abgesehen vom Platzbedarf – überhaupt ein Problem darstellt. Der Platzbedarf ist mMn ein kosmetisches Problem und zudem gehe ich heutzutage davon aus, dass mir eine Tastatur zur Eingabe bereitgestellt wird. Hier wäre es mit type="number" sogar die richtige Tastatur.

das ist mehr als nur ein „kosmetisches Problem“. Mit eingeblendeter Tastatur ist das Spielfeld entweder so klein, dass man nichts mehr erkennt, oder es wird die Hälfte überdeckt und man hat keinen Überblick mehr. Außerdem zoomt das iPhone auch noch in das Eingabefeld und nach der Eingabe muss man selbst wieder zurückzoomen.

Ich hatte diese Variante ein paar Tage online und selbst noch länger im Test. Das war keine Lösung. Dann lieber auf Backspace verzichten oder zwei Versionen.

Gruß
Jürgen

[JürgenB]

Hallo,

bei Backspace (key==8) wird der Handler mit

	e.preventDefault();
	e.stopPropagation();
	return false;

beendet.

ich glaube, ich habe eine Lösung gefunden: ich habe auf keydown umgestellt und noch e.cancelBubble = true eingefügt. Wobei wahrscheinlich keydown die entscheidende Änderung war. Mal heute abend sehen, was der Safari dazu meint ...

Gruß
Jürgen

[JürgenB]

Hallo,

bei Backspace (key==8) wird der Handler mit

	e.preventDefault();
	e.stopPropagation();
	return false;

beendet.

ich glaube, ich habe eine Lösung gefunden: ich habe auf keydown umgestellt und noch e.cancelBubble = true eingefügt. Wobei wahrscheinlich keydown die entscheidende Änderung war. Mal heute abend sehen, was der Safari dazu meint ...

keydown ist die Lösung. Bei keyup wurde die Seite schon verlassen, bevor der Event feuern konnte. e.cancelBubble war ja nur für die alten IEs der Ersatz für stopPropagation().

Noch mal vielen Dank für die Hilfe.

Gruß
Jürgen