Function innerhalb eines forms ausführen

[Hans im Glück]

Hallo Leute,

ich möchte gerne ein Div-Objekt mittels eines Klicks auf ein Bild aufrufen.
Innerhalb dieses aufgerufenen Div-Objekts kann ebenfalls mit nem Klick auf ein Bild das Objekt wieder geschlossen werden.

Folgendermaßen gelöst:
[..
   <script type="text/javascript">
   function offen(chk)
            {
            var fs = document.getElementById('fenster_' + chk.id);
            fs.style.display = '';
            }
   function schliessen(chk)
            {
            var fs = document.getElementById('fenster_' + chk.id);
            fs.style.display = 'none';
            }
   </script>
..

//Aufruf um die Box zu öffnen
<input type="image" id="box_1" name="details" src="../gfx/info.jpg" onclick="offen(this);">

//Box inkl. des Bildes zum schließen
<div id="fenster_box_1" class="rechte_details" style="display:none;"><font class=stichwort>Details f&uuml;r: $name[$x]</font><input type="image" name="detailrecht" id="box_1" src="../gfx/close.jpg" onclick="schliessen(this);"></div>
..]

Das klappt soweit, wobei mein Firefox meckert, dass ein Element mit der ID "box_1" doppelt definiert wird. Dem muss man ja nun auch zustimmen.

Meine Fragen:

1.) Wie kann ich es so machen, dass Firefox da nicht mehr meckert?
Es muss ja nunmal das Div-Objekt doppelt angesprochen werden: einmal zum öffnen und ein weiteres mal zum schließen

2.) Wenn ich dass ganze jetzt mit einem <form>-Tag umfasse, da man noch diverse andere Dinge eingeben kann, funzt das ganze nicht mehr, da durch Klick auf meine Bilchens ja auch das Form abgeschickt wird.
Es muss also was anderes her als <input type="image">
Also habe ich <img> genutzt. Soweit funktioniert es auch, nur erscheint jetzt nicht mehr das "Hand-Symbol" wodurch der User ja erkennt, dass man dort klicken kann. Es bleibt also der ganz "normale" Mauszeiger und der ahnungslose User erkennt somit nicht, dass er dort klicken kann.

Was kann ich da machen?
Muss ich das mit nem onmouseover lösen?
Wenn ja, wie mache ich das mit der Hand?
Gibt es da eine Quelle die ich direkt ansprechen kann, oder muss ich mir die Hand selbst als Bild anfertigen?

Vielen Dank für Eure Hilfe und Glückauf

Hans im Glück

[Don P]

Hallo,

  

>    function offen(chk)  
>             {  
>             var fs = document.getElementById('fenster_' + chk.id);  
>             fs.style.display = '';  
>             }  
>    function schliessen(chk)  
>             {  
>             var fs = document.getElementById('fenster_' + chk.id);  
>             fs.style.display = 'none';  
>             }

1.) Wie kann ich es so machen, dass Firefox da nicht mehr meckert?
Es muss ja nunmal das Div-Objekt doppelt angesprochen werden: einmal zum öffnen und ein weiteres mal zum schließen

Die Funktionen zum Öffnen und Schleißen bekommen doch das Element als Parameter mitgeliefert. Es ist nicht nötig, das man es dann nochmal mit getElementById aus dem DOM-Baum klaubt mit

var fs = document.getElementById('fenster_' + chk.id);

Du sagst ja auch nicht zu deiner Freundin "frag mal hier rum nach einer Person mit meinem Namen, und küss' die dann." ;)
Also brauchst du keine ID und schon gar keine doppelt vergebene.

Gruß, Don P

[Don P]

Hallo Hans,

*kopfpatsch*
Erst jetzt gesehen: Du wilsst ja doch ein aderes Element ansprechen als das übergebene. Also vergiss mein Geschreibsel oben.

Gruß, Don P

[Don P]

Hallo,

function offen(id)
            {

document.getElementById(id).style.display = '';

}
   function schliessen(id)
            {

document.getElementById(id).style.display = 'none';

}

//Aufruf um die Box zu öffnen

<input type="image" name="details" src="../gfx/info.jpg" onclick="offen('fenster_box_1');">  

//Box inkl. des Bildes zum schließen

<div id="fenster_box_1" class="rechte_details" style="display:none;">  
  <input type="image" name="detailrecht" src="../gfx/close.jpg" onclick="schliessen('fenster_box_1');">  
</div>  

So würd's gehen.
Aber Style-Eigenschaften gehören ins Stylesheet, nicht in die HTML-Tags.
Dann kann man einfach durch classname-Zuweisungen die style-Eigenschaften per JavaScript ändern, wenn der Benutzer dass nicht zufällig deaktiviert hat.

Gruß, Don P

[Hans im Glück]

Sowohl Steel, als auch Dir lieben Dank für Eure Hilfe.
Alle Probleme habe ich Dank Eurer Lösungsansätze und Links lösen können.

DANKE!

Hans

[Steel]

Moin!

Das eine ID im ganzen Dokument maximal einmal vorkommen darf wurde Dir ja schon mehr oder weniger explizit erklaert. Es ist ein Fehler, eine ID mehrfach zu verwenden und auch nicht noetig.

Es gibt verschiedene Moeglichkeiten deine Grafiken zu benutzen. Du kannst z.B. per JS das submit abfangen, wenn man auf die Grafiken klickt. Das waere trotzdem eine Vergewaltigung von Inputelementen. Wenn Du ein klickbares Element hast, dann kannst Du auch <http://de.selfhtml.org/css/eigenschaften/anzeigefenster.htm#cursor@title=per CSS den Mauszeiger anpassen>.