Ergebnis 1 bis 8 von 8
  1. #1
    Daphne26 ist offline Jungspund
    registriert
    07-01-2006
    Beiträge
    12

    Tabelle: Per Pfeiltaste von Zeile zu Zeile springen?

    Hallo alle zusammen,

    kann ich per Javascript in einer Tabelle mit den beiden Pfeiltasten "nach oben" und "nach unten" von Zeile zu Zeile springen (entweder nach oben oder nach unten)? So dass die jeweils aktive Zeile immer einen anderen background-color hat?

    Geht sowas?
    Bin für jeden Tipp dankbar.

    Gruß
    Daphne

  2. #2
    Avatar von inco
    inco ist offline Haudegen
    registriert
    17-11-2005
    Ort
    Berlin
    Beiträge
    646

    AW: Tabelle: Per Pfeiltaste von Zeile zu Zeile springen?

    Hi Daphne,

    das mit den Pfeiltasten wird schwierig, du müsstest ein key-event-listener auf jede Zelle setzen etc.
    einfacher ist das bereits implementierte "tabindex".
    Vielleicht genügen dir ja die Tabulator-Taste für runter
    und die Kombination Shift-Tab-Taste für rauf, dann wäre mein Tipp:

    PHP-Code:
    <table>
    <
    tr><td tabindex=1 onFocus=this.style.backgroundColor='pink' onBlur=this.style.backgroundColor='white'>test1</td></tr>
    <
    tr><td tabindex=2 onFocus=this.style.backgroundColor='pink' onBlur=this.style.backgroundColor='white'>test2</td></tr>
    <
    tr><td tabindex=3 onFocus=this.style.backgroundColor='pink' onBlur=this.style.backgroundColor='white'>test3</td></tr>
    <
    tr><td tabindex=4 onFocus=this.style.backgroundColor='pink' onBlur=this.style.backgroundColor='white'>test4</td></tr>
    </
    table
    gruß inco
    Gruß
    inco
    ···································································································· ········································································
    Nur der Statistiker glaubt, mit dem Kopf im Ofen und den Füßen im Sektkühler müsste es ihm durchschnittlich gut gehen!

  3. #3
    Daphne26 ist offline Jungspund
    registriert
    07-01-2006
    Beiträge
    12

    Geht es nicht irgendwie über die ASCII-Identifikation?

    Hallo,

    vielen Dank für Deine Hilfe. Aber es müsste doch eigentlich auch über die Pfeiltasten gehen. Ich stelle mir das wir folgt for:

    Bei Tastatureingabe, werden jeweils die Eingabe-Ascii-Werte per Javascript geprüft. Sofern die Pfeiltaste-unten geklickt wird, löst der entsprechende Ascii-Wert (40) die Aktion aus, das das untere Tabellenfeld z.B. gelb markiert wird. Bei dem Ascii-Wert 38 (Pfeil oben) wird ein Tabellenfeld darüber gelb formatiert usw ....

    Soweit die Theorie, nur wie setze ich das ganze in Javascript um? Wie fange ich die Ascii-Werte der Pfeiltasteneingabe ab? Mit "charCodeAt()" funktioniert es glaube ich nicht.

    Wer hat mehr Ahnung als ich?

    Gruß
    Daphne

  4. #4
    pit-r Guest

    AW: Tabelle: Per Pfeiltaste von Zeile zu Zeile springen?

    Moin!

    Beispiel:
    PHP-Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <
    html>
    <
    head>
    <
    title>Hüühüpf</title>
    <
    script type="text/javascript">
    ie=typeof document.all=='object';
    var 
    tletztezeilenzeile=1;
    function 
    huepf(e){
    if(!
    e)e=window.event;
    key=e.which?e.which:e.keyCode;
    if(
    key==40&&zeile<zeilen)zeile++;
    if(
    key==38&&zeile>1)zeile--;
    machHintergrund(zeile);
    }
    function 
    machHintergrund(welche){
    z=t.rows[welche-1];
    if(
    letzte)letzte.style.backgroundColor='#ffffff';
    z.style.backgroundColor='#ffff00';
    letzte=z;
    }
    function 
    init(){
    t=document.getElementById('tabelle');
    zeilen=t.rows.length;
    machHintergrund(zeile);
    if(
    ie)document.onkeydown=huepf;
    else 
    document.onkeypress=huepf;
    }
    </script>
    </head>
    <body onload="init();">
    <table border="1" id="tabelle">
    <tr><td>Zeile 1</td></tr>
    <tr><td>Zeile 2</td></tr>
    <tr><td>Zeile 3</td></tr>
    <tr><td>Zeile 4</td></tr>
    <tr><td>Zeile 5</td></tr>
    <tr><td>Zeile 6</td></tr>
    </table>
    </body>
    </html> 
    Ahoi - Pit

  5. #5
    Daphne26 ist offline Jungspund
    registriert
    07-01-2006
    Beiträge
    12

    PERFEKT - Danke

    Wow, das ging aber schnell. Vielen Dank, genau so habe ich mir das vorgestellt ;-)
    Gruß
    Daphne

  6. #6
    pit-r Guest

    AW: Tabelle: Per Pfeiltaste von Zeile zu Zeile springen?

    Gern geschehen.

    Ahoi - Pit

  7. #7
    alex.maier ist offline Jungspund
    registriert
    21-04-2006
    Beiträge
    17

    AW: Tabelle: Per Pfeiltaste von Zeile zu Zeile springen?

    hallo,

    bin eben auf diesen thread gestossen, weil ich auch genau soetwas suche.

    nun noch die frage, gibt es auch die möglichkeit den focus damit auf und ab zu bewegen?

    hintergrund ist, das ich mit den pfeiltasten hoch und runter möchte um dann mit enter eine auswahl zu treffen (onclick).

    ich hab das script eben mal probiert und es funktioniert super, aber drückt man dann in dieser tabelle die tab taste, dann bewegt sich der focus unabhängig vom markierten hintergrund auf und ab (tab/shift-tab).
    auf enter reagiert dann natürlich nur das was unter dem focus liegt, nicht aber das was unter dem farblich markierten hintergrund liegt.
    natürlich kann ich ja die tab taste sperren, aber am besten wärs, wenn pfeil auf/ab dem tab/shift-tab entsprechen würde, bzw. wenn man das irgendwie ummünzen könnte, das bei der pfeil-auftaste ein tab "simuliert" wird und bei pfeil nach unten ein shit-tab", dann könnte man schön den focus hin und her bewegen und mit enter auswählen.

    gibts da ne möglichkeit?

    vielen dank vorab.


    alex

  8. #8
    cybaer ist offline Kaiser
    registriert
    12-09-2006
    Beiträge
    1.338

    AW: Tabelle: Per Pfeiltaste von Zeile zu Zeile springen?

    Zitat Zitat von alex.maier Beitrag anzeigen
    gibts da ne möglichkeit?
    Wenn ein Element die Methode focus() kennt, dann darf man sie auch benutzen.
    Gruß, Cybaer

Ähnliche Themen

  1. Div-Größe anpassen
    Von Tiefflieger im Forum CSS und (X)HTML
    Antworten: 14
    Letzter Beitrag: 14-01-2005, 02:37
  2. Antworten: 37
    Letzter Beitrag: 02-08-2004, 20:53
  3. per ASP eine Tabelle aus Access Datenbank auslesen...
    Von .:big-mac:. im Forum Serverseitige Programmierung
    Antworten: 4
    Letzter Beitrag: 02-04-2003, 15:18

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •