JavaScript: Problem mit DropDown-Feld in einem DatePicker

Ich hab hier so einen DatePicker in JavaScript. Wenn ich auf einen Button klicke, geht er an, wenn ich auf einen anderen Button klicke, geht er aus.

Der DatePicker hat auch noch die Fähigkeit, sich zu schließen, wenn man mindestens zwei Sekunden mit der Maus hinausgeht. Das hab ich so gemacht, dass ich zu jedem Element in dem DatePicker das onmouseover und das onmouseout mit folgenden Funktionen überschrieben habe:

var tableTimer;

function MouseOverTable()
{
  clearTimeout(tableTimer);
}

function MouseOutTable(dateFieldName, dateString)
{
  clearTimeout(tableTimer);

  tableTimer = setTimeout("updateDateField(false, false, '" + dateFieldName + "', '" + dateString + "', false)", 1000);
}

Nun zum Problem:

Der DatePicker hat auch noch eine DropDown-Box. Und jetzt passiert folgendes:
Wenn ich mit dem Internet Explorer die DropDown-Box anklicke und in das Auswahlfeld gehe, dann registriert der DatePicker, dass ich in keinem seiner Elemente mehr bin und schmeißt den Timer an, was bedeutet: Sobald ich versuche, einen Eintrag aus der DropDown-Box auszuwählen, geht das ganze Ding nach zwei Sekunden zu, weil der Browser denkt, ich würde mich nicht mehr im DatePicker befinden. (Weil die Liste der DropDown-Box wohl als separates Element neben der DropDown-Box selbst behandelt wird.)
Im Firefox funktioniert alles wie gewünscht: Solange ich in der DropDown-Liste bin, bleibt der Timer aus.

Was kann ich tun, damit auch im Internet Explorer erkannt wird, dass ich noch im DatePicker bin, wenn die Liste ausgeklappt ist?

Nico D.

Versuch's einfach damit, dass du alle anderen Elemente, ausser dem DatePicker, mit dem Event "onMouseOver" belegst. Und zwar mit deiner MouseOut-Methode. Und dein bisheriges onMouseOut-Ereignis muss leer bleiben. Damit erreichst du, dass der IE das Teil erst dann schliesst, wenn du mit der Maus wirklich ueber anderen Elementen stehst.

Ich glaub, das ist keine so gute Idee. Immerhin müsste ich dann ja auf jeder Seite, wo so ein DatePicker vorkommt, jedes Element mit eineziehen. Stell dir vor, da hat man 20 Elemente auf dem Bildschirm und fünf DatePicker. Und dann kommt ein Element hinzu und man muss jedesmal daran denken, dafür das MouseOver-Event zu überschreiben. Außerdem: Es besteht ja nicht alles aus Steuerelementen. Wie soll ich es abfangen, wenn die Maus einfach nur auf leeren Hintergrund zeigt?

Gibt's eigentlich eine Möglichkeit, den Status der DropDown-Box abzufragen? So nach dem Motto

selectionIsAufgeklappt("meineDropDownBox")

wobei "meineDropDownBox" das name- oder id-Tag (<select name="meineDropDownBox" ...>) ist.

Alternativ wäre es auch eine Lösung, wenn ich wüsste, wie man den DatePicker wieder ausblenden kann, indem man einfach an eine beliebige Stelle außerhalb des DatePickers klickt. (Dann könnte ich auf den Timer verzichten.) Es gibt ja das Event onblur. Aber das gilt nur für so Sachen wie Textboxen, Buttons oder Links. Aber der DatePicker ist bei mir ein div, in dem ein table ist. Mein Code ist eine Erweiterung von diesem Teil hier: www.nsftools.com/tips/DatePickerTest.htm

Nico D.

Das waere in etwa das gleiche, als wuerdest du das besagte onMouseOver-Event auf allen anderen Elementen nutzen. Javascript, HTML und Co. sind dafuer einfach nicht das Richtige. Ans Web 2.0 hat man einfach zu spaet gedacht. Das merkt man daran, dass sich die Browser zu unterschiedlich verhalten. Um das einheitlich hinzubekommen, gibt es zwei Moeglichkeiten:

von mir bevorzugt: Verzichte komplett aufs Web 2.0 und arbeite mit HTML - ggf. dynamisch, z.B. per PHP - und POST. Ich kann dir sogar dafuer einen DatePicker zukommen lassen, den ich selbst geschrieben habe.
Du greifst auf einheitliche Skriptsprachen zurueck, wofuer man als Benutzer allerdings ggf. Zusatzsoftware benoetigt, wie z.B. Flash.

Benutzerfreundlicher ist wohl Variante 1, auch wenn's vllt. als Designer gesehen nicht schoen aussieht, dafuer umso transparenter und uebersichtlicher: Man weiss sofort, wo das Datum auszuwaehlen ist.

JS-Hasser schrieb:

Aber der DatePicker ist bei mir ein div

Dann erzeug doch lediglich in dem Div das In- und out Event.