Hallo,

unzwar mache ich gerade ein Praktikum in Holland.
Habe mich heute, das erste mal, etwas mehr mit JavaScript auseinandergesetzt, da wir hier dauernt Probleme bekommen (ich und der andere Praktikant), die wir nur mit JavaScript lösen können.

Er kommt grade nicht weiter, daher dachte ich mir, ich frage mal die netten Deutschen.

Also:
Wir haben ein Formular. In diesem Formular befinden sich Eingabefelder, dann kommt eine Checkbox und danach nochmal drei Eingabefelder.
Wir wollen nun TAB und ENTER dafür benutzen, um durch das Formular zu TABben. Man kennt das ja, das man etwas eingibt, TAB drückt und dann im nächsten Eingabefeld weiter machen kann.

Dies wollen wir mit TAB und ENTER ermöglichen.

Auserdem sind die letzten drei Eingabefelder deaktiviert. Diese werden entweder durch einen klick auf unsere Chechbox ODER durch das Drücken von SPACE aktiviert.

Nun wollen wir, wenn wir in der Checkbox sind, und die Felder nicht aktiviert sind, sprich kein Haken in der Checkbox ist, und wir dann TAB bzw. ENTER drücken, dass wir dann weiterhin in der Checkbox bleiben, anstatt in die Adresszeile des Browsers zu TABben.

Könnt ihr mir/ihm helfen?

Was wichtig ist. Wenn ihr CODE postet, dann bitte mit Erklärungen. Ich möchte ja schliesslich etwas lernen, und nicht demnächst wieder fragen müssen.^^

Bis dann erstmal

und schonmal vielen Dank im voraus.

mfG
theSonGoku

Hallo,

die Taste TAB hat in Browser eine Sonderfunktion (nämlich das TABben), die nicht mit Javascript beeinflusst werden kann! Man kann es aber so machen, dass du z.B. A drückst und dann in das nächste Formular wechselst

Also,

er sagt, dass er bzw. wir, bereits zwei Formulare haben.

Es sit nun so, dass die drei Eingabefelder, sowie die Checkbox, im zweiten Formular sind.
Wenn er nun von dem letzten Eingabefeld TABbt, also zur Checkbox geht, dann switcht er ja automatisch von Formular 1 zu 2.
Wenn er allerdings im Formular 2 ist, und die Eingabefelder aktiviert sind, und er dann im letzten Eingabefeld ist und dann TAB drückt, dann bleibt er in diesem Eingabefeld und TABt nicht zur Adresszeile.

Aber wenn er in der Checkbox ist, und dann TABt (die Eingabefelder sind in diesem Moment deaktiviert), dann TABt er zur Adresszeile.

Demnach muss er das TABen ja irgendwie beeinflusst haben, da er ansonsten vom letzten Eingabefeld ja in die Adresszeile gehen würde, anstatt im Feld zu bleiben.

Also, warn liegt es.^^

mfG
theSonGoku

PS: Ich würde recht ungerne CODE posten, da er sich das, da er GARKEINE Ahnung von JavaScript hat, aus dem Internet zusammen gegoogelt hat, und wir daher nicht wirklich wisse, was der CODE eigendlich macht.^^

Ich vermute mal, er hat tabindex verwendet. Das ist ein HTML-Attribut, mit dem du die Reihenfolge der TAB Taste festlegen kannst. Die Reihenfolge der Formulare wird mit Nummern festgelegt. Das Formular, das zuerst ausgewählt werden soll, bekommt den niedrigsten tabindex (das währe 1), das darauf folgende den nächsthöheren tabindex, usw..

Hier ein kurzes Beispiel dazu:
<input type="text" value="Wird danach getabt" tabindex="2">
<input type="text" value="Wird zuerst getabt" tabindex="1">

Erstmal vorweg, danke für die Hilfe. Wusste ich noch nicht.

Ich habe mich nochmal mit ihm besprochen.
Er sagt, er hat in dem zweiten Formular, dass so hinbekommen, dass er, wenn er im letzten Eingabefeld ist (es gibt 3) und dann TAB drückt, er in diesem bleibt.
Normalerweise, wäre er ja in die Adresszeile getabt.

Und genauso wie er in diesem Eingabefeld bleibt, möchte er auch, wenn die drei Eingabefelder nicht aktiviert sind, in der Checkbox bleiben, anstatt in die Adresszeile zu kommen.

Ich hoffe, es war verständlich beschrieben.^^ Kannst uns auch gerne korrigieren, denn ich denke, dass du schon recht viel Ahnung hast.

mfG
theSonGoku

Ihr wollt also ein Eingabefeld machen, das man nicht mehr verlassen kann?

Das lässt sich so machen:

Für Checkboxen:

onblur wird beim Verlassen des Elements aufgerufen. Mit der Zeile this.focus() wird der Mauszeiger aber wieder auf das Element gesetzt. Das hat den Effekt, dass man das Element nicht mehr verlassen kann, auch nicht durch drücken der TAB Taste.

Vielen Dank.
Nun habe ich schon fast genau das, was ich möchte.^^ Aber eben nur fast.

Also:
Ich möchte die Checkbox NICHT verlassen können, wenn die drei Eingabefelder darunter DEAKTIVIERT sind.
In dem Fall, wäre deine Lösung richtig.
Sind die drei Eingabefelder allerdings AKTIVIERT (durch einen klick auf die Checkbox bzw. durch SPACE, wenn man in der Checkbox drin ist), dann soll man mit TAB in das nächste Eingabefeld (also das erste der drei) wechseln können.


Das ist alles.^^ Ich weis nicht, ob das schwer ist, oder nicht, da ich kaum Erfahrung mit JavaScript habe.

Habe JS hier: www.w3schools.com/JS/default.asp gelernt.
Allerdings kann ich bisher damit nichts machen, was mir persönlich helfen würde.


€dit:

Habe das mit onBlur versucht, hat aber nicht funktioniert.

mfG
theSonGoku

Ich habe dir dein Script erstellt:

Vielen Dank.
Ich habe den Quelltext, beim durchlesen, auf anhieb verstanden.
Werde ihn mal schnell testen.

Achja:
Wie macht man das, dass man mit ENTER auch durch die Eingabefelder tabben kann?
Das hat mein Kollege zwar hinbekommen, durch Copy&Past, aber er versteht den Text selber nicht ganz.


Kannst du/Könnt ihr mir vll sagen, wie das geht bzw. wie der Quelltext dazu aussieht?


€dit:

So verlockend, wie der Quelltext auch aussah. Es hat leider nicht funktioniert. Ich tabbe, wenn ich in der Checkbox bin, und dann nochmal TAB drücke, nach wie vor, in die Adresszeile.


mfG
theSonGoku

Ich habe den Code umgeändert, dass jetzt auch das Taben mit ENTER funktioniert und du außerdem nicht mehr in die Adresszeile gelangst:
<form name="TAB_Form" action="">
<input type="checkbox" name="Checkbox" value="0" onblur="if(weitertaben<1)this.focus()" onclick="javascript:Teste()" onkeydown="Nummer = 0;Enter_taben()"><br>
<input type="text" value="" onkeydown="Nummer = 1;Enter_taben()"><br>
<input type="text" value="" onkeydown="Nummer = 2;Enter_taben()"><br>
<input type="text" name="letztes_Eingabefeld" value="" onblur="document.TAB_Form.Checkbox.focus()" onkeydown="Nummer = 3;Enter_taben()">
</form>
<script type="text/javascript">
<!--
var weitertaben = 0;
var Nummer = 0;

function Teste()
{
if(document.TAB_Form.Checkbox.checked==true)
weitertaben = 1;
else
weitertaben = 0;
}

function Enter_taben(Ereignis)
{
if(!Ereignis)
Ereignis = window.event;
if(Ereignis)
{
Nummer++;
if(Nummer>document.TAB_Form.elements.length-1)
Nummer = 0;
if((Ereignis.keyCode==13)||(Ereignis.which==13))
document.TAB_Form.elements[Nummer].focus();
}
}
//-->
</script>
Ab jetzt kommst du nach dem letzten Element nicht mehr in die Adresszeile, sondern direkt auf's erste Element. Das wird allerdings auch ausgeführt, wenn du es mit der Maus verlässt!

Wie du in dem neuen Code erkennen kannst, haben jetzt auch alle inputs ein onkeydown bekommen. Damit wird das Taben durch ENTER ermöglicht. Die Variable Nummer (im Code rot geschrieben) gibt an, um das wievielte Element in "TAB_Form" es sich handelt (wenn du neue inputs hinzufügst, musst du daher auch diese Zahl anpassen).

Die Funktion Enter_taben(Ereignis) überprüft mithilfe des Tastencodes, ob und welche Taste gedrückt wurde. Ist der Tastencode 13 (= die Nummer für ENTER), wird, anhand der Variable Nummer, der Mauszeiger auf das nächste Element gesetzt.