JS / jQuery: TD bei focus selektieren
0 0 
Matthias Apsel
0 1 
MudGuard
0 
molily
JS / jQuery: TD bei focus selektieren
Guten Morgen,
ich komme einfach nicht weiter. Ich habe eine Tabelle, ähnlich einer ExcelTabelle (wenn auch ungleich einfacher), die einzelnen TDs sind mit contentEditable=true ausgestattet. Jetzt möchte ich jedoch das bei einem focus auf das jeweilige TD der Inhalt markiert wird, wie select() bei Input-Feldern.
Problem #1: jQuery.focus() funktioniert nicht mit TDs, bekomme es mit simplen onfocus="event()" hin, sieht aber unsauberer aus finde ich, aber ist nicht sooooo tragisch.
Problem #2: Ich bekomme es einfach nicht hin das der Inhalt direkt markiert wird, wenn ich einen click drauf feuere oder den Focus durch einen Tab in das nächste Element springen lasse =(
Theoretisch könnte ich in jedes TD auch ein Input-Feld schreiben, doch Input-Felder haben den nachteil das Sie links und oben jeweils einen Mindestabstand zum Inhalt haben, ich brauche aber kleine Felder. Oder gäbe es da einen Weg die Inputs mit den Zahlen/Buchstaben darin abzuschließen ohne "gezwungenes Padding"
LG
Jay
-
So soll es nicht aussehen =) Als BSP
-
Om nah hoo pez nyeetz, JayScript!
Theoretisch könnte ich in jedes TD auch ein Input-Feld schreiben, doch Input-Felder haben den nachteil das Sie links und oben jeweils einen Mindestabstand zum Inhalt haben, ich brauche aber kleine Felder. Oder gäbe es da einen Weg die Inputs mit den Zahlen/Buchstaben darin abzuschließen ohne "gezwungenes Padding"
Wenn du eine Eingaben ermöglichen möchtest, ist das input-Element die richtige Wahl. Zu deinem Fiddle:
- center ist ein missbilligtes Element, es sollte nicht verwendet werden.
- input ist von Hause aus ein inline-Element, es reagiert also nicht auf Breitenangaben, die Breite wird in Abhängigkeit vom Wert des Attributes "size" ermittelt, Abhilfe schafft display: inline-block und width: 10px;
- none ist kein gültiger Wert für padding.
Matthias
-
- center ist ein missbilligtes Element, es sollte nicht verwendet werden.
- input ist von Hause aus ein inline-Element, es reagiert also nicht auf Breitenangaben, die Breite wird in Abhängigkeit vom Wert des Attributes "size" ermittelt, Abhilfe schafft display: inline-block und width: 10px;
- none ist kein gültiger Wert für padding.
Ok center: weg; Display geändert, sieht schonmal besser aus, jedoch hat es nach wie vor diesen blöden Effekt das ich das Input nicht unter eine gewisse Pixelzahl bekomme, deswegen wollte ich ja eig mit contentEditable arbeiten, weil sich da das Element an den Inhalt anpasst =D Wenn da das blöde selektieren nicht wäre, was mit Input viel einfacher wäre ...
-
Hi,
- input ist von Hause aus ein inline-Element, es reagiert also nicht auf Breitenangaben,
non sequitur.
um auf width (CSS) nicht zu reagieren, müßte input ein non-replaced-inline-Element sein.
Es ist aber ein replaced-inline-Element (so wie z.B. auch img).⇒ input reagiert auf width/height im CSS.
die Breite wird in Abhängigkeit vom Wert des Attributes "size" ermittelt,
aber: CSS überschreibt HTML-Attribute.
Abhilfe schafft display: inline-block und width: 10px;
ist bei replaced-inline-Elementen nicht nötig.
cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
O o ostern ...
Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
-
Hallo,
1. http://aktuell.de.selfhtml.org/artikel/javascript/textauswahl/
2. Focus funktioniert hervorragend in meinem Test:<!DOCTYPE html> <table><tr><td contenteditable>foo</td></tr></table> <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script> <script> [code lang=javascript]$('td').focus(function() { console.log('focus'); });</script>[/code]
Mathias
-
Hallo,
- http://aktuell.de.selfhtml.org/artikel/javascript/textauswahl/
- Focus funktioniert hervorragend in meinem Test:
Ja, bei mir auch, und ca nach dem 3. Mal (neuer Seitenaufruf) geht es wieder nicht, in der jQuery API steht auch das es nur für Input und Textarea gedacht ist. Mal ging es, mal passierte nichts, ohne das irgendwas geändert wurde am Quelltext.
-
