Robin Popp: fehler bei onclick div-inhalt austauschen

Hallo Ihrs,

Ich habe mit den mir etwas eingeschränkten JavaScript-Kenntnissen folgendes programmiert, das beim Klicken auf ein kleines Bild
1. das angeklickte Bild austauscht
2. ein anderes Bild austauscht
3. und hier liegt das problem, den Inhalt eines DIVs austauscht.

Ich habe versucht, den auszutauschenden Inhalt mit einem Array zu deklarieren und dann bei onClick die Funktion dafür abzurufen, die diesen Inhalt dann in das DIV schreibt.
Klickt man nun auf ein Bild, lädt im IE eine neue Seite und schreibt links oben dann beispielsweise text3 hin. Im NS (4.7) passiert einfach gar nichts, keine der drei Funktionen wird abgerufen. Die NS-JavaScript-Konsole meldet dann: document[Name] has no properties.
Das muss an diesem DIV-Inhalt austauschen liegen, vorher hat der Bildaustausch wenigstens funktioniert.

Wo liegt der Fehler? Bin nicht gerade ein Profi ;-)

Hier in abstrahierter Form mein Code:

<head>
...
<script language="JavaScript"><!--
{
clickOne1=new Image();
clickOne1.src="../../images/galerie/bild1on.jpg";
clickTwo1=new Image();
clickTwo1.src="../../images/galerie/bild2on.jpg";
clickThree1=new Image();
clickThree1.src="../../images/galerie/bild3on.jpg";
clickFour1=new Image();
clickFour1.src="../../images/galerie/bild4on.jpg";
clickFive1=new Image();
clickFive1.src="../../images/galerie/bild5on.jpg";
clickSix1=new Image();
clickSix1.src="../../images/galerie/bild6on.jpg";
clickSeven1=new Image();
clickSeven1.src="../../images/galerie/bild7on.jpg";
clickEight1=new Image();
clickEight1.src="../../images/galerie/bild8on.jpg";
clickNine1=new Image();
clickNine1.src="../../images/galerie/bild9on.jpg";
}
function click(Name,Image,No)
 {
 document[Name].src=eval(Image+No+".src")
 }
// --> </script>

<script language="JavaScript"><!--
{
show1=new Image();
show1.src="../../images/galerie/bild1.jpg";
show2=new Image();
show2.src="../../images/galerie/bild2.jpg";
show3=new Image();
show3.src="../../images/galerie/bild3.jpg";
show4=new Image();
show4.src="../../images/galerie/bild4.jpg";
show5=new Image();
show5.src="../../images/galerie/bild5.jpg";
show6=new Image();
show6.src="../../images/galerie/bild6.jpg";
show7=new Image();
show7.src="../../images/galerie/bild7.jpg";
show8=new Image();
show8.src="../../images/galerie/bild8.jpg";
show9=new Image();
show9.src="../../images/galerie/bild9.jpg";
}
function gallery(Name,Image,No)
 {
 document[Name].src=eval(Image+No+".src")
 }
// --> </script>

<script language="JavaScript"><!--
var text = new Array()
text[0] = ""
text[1] = "blablaEINS"
text[2] = "blablaZWEI"
text[3] = "blablaDREI"
text[4] = "blablaVIER"
text[5] = "blablaFUNF"
text[6] = "blablaSECHS"
text[7] = "blablaSIEBEN"
text[8] = "blablaACHT"
text[9] = "blablaNEUN"

function write(Name, No)
 {
 document.bildunterschrift.document.clear();
    document.bildunterschrift.document.write('<table width="585" border="0" cellspacing="0" cellpadding="0"><tr><td align="left" valign="top" width="290"><font face="Arial, Helvetica, sans-serif" size="2">');
    document.bildunterschrift.document.write('<span class="textsmall">"+text[]+"</span>');
    document.bildunterschrift.document.write('</font></td><td width="295"></td></tr></table>');
 }
// --> </script>

<link rel="stylesheet" href="../../css/contact.css" type="text/css">
...
</head>

<body>
...
<a href="#" onclick="click('clickOne','clickOne',1),gallery('show','show',1),write('text',1)"><img src="../../images/galerie/bild1off.gif" name="clickOne" border="0"></a>
<a href="#" onclick="click('clickTwo','clickTwo',1),gallery('show','show',2),write('text',2)"><img src="../../images/galerie/bild2off.gif" name="clickTwo" border="0"></a>
<a href="#" onclick="click('clickThree','clickThree',1),gallery('show','show',3),write('text',3)"><img src="../../images/galerie/bild3off.gif" name="clickThree" border="0"></a>
...
<div id="bildunterschrift" style="position: absolute; visibility: visible; left: 8px; top: 300px; z-index: 2; width: 600px; height: 30px" align="left"> 
</div>

Ich hoffe, Ihr könnt mir helfen ... Danke, Robin

  1. Klingt doch ganz gut!
    versuchs mal statt
    document.bildunterschrift.write()
    mit document.bildunterschrift.innerHTML="text";

    und das clear() erübrigt sich dann auch.

    1. Danke AB,

      aber das wars auch nicht. Hier der modifizierte Code. Ich hab jetzt alles mögliche ausprobiert, was mir einigermassen logisch erschien bzw. meinen Kenntnissen entspricht ;-)

      Ich gehe davon aus, dass nur folgendes fehlerhaft ist. Was muss da rein?

      <script language="JavaScript"><!--
      var text = new Array()
      text[0] = ""
      text[1] = "blablaEINS"
      text[2] = "blablaZWEI"
      text[3] = "blablaDREI"
      etc.

      function write(WAS MUSS HIER REIN???)
       {
          document.bildunterschrift.innerHTML='<table width="585" border="0" cellspacing="0" cellpadding="0"><tr><td align="left" valign="top" width="290"><font face="Arial, Helvetica, sans-serif" size="2">';
          document.bildunterschrift.innerHTML='<span class="textsmall">"+text[]+"</span>';
          document.bildunterschrift.innerHTML='</font></td><td width="295"></td></tr></table>';
       }
      // --> </script>

      ...
      und im body:
      ...

      <a href="#" onclick="click('clickOne','clickOne',1),gallery('show','show',1),write(WAS MUSS HIER REIN?)"><img src="../../images/galerie/bild1off.gif" name="clickOne" border="0"></a>
      ...
      <div id="bildunterschrift" style="position: absolute; visibility: visible; left: 8px; top: 300px; z-index: 2; width: 600px; height: 30px" align="left"> 
      </div>
      ...

      was muss denn da rein, dort wo ich geschrieben hab "WAS MUSS HIER REIN?" ;-)

      abgesehen davon nimmt er eh nur die Funktion "gallery", die "click" ignoriert er auch, aber das ist mir jetzt nicht so wichtig.

      Danke

      1. Also. Es gibt mehrere Bilder, und beim Klick auf eines
        von ihnen soll in der div die Beschreibung stehen.
        Also, das machen wir so:
        var text=new Array("", "blablaEINS", "blablaZWEI");

        function write(x)
        {
        document.bildunterschrift.innerHTML=text[x];
        }
        <a onclick="write(1)">
        <img id="bild" src="soundso.xyz">
        </a>
        <a onclick="write(2)">
        <img id="bild" src="nichso.xyz">
        </a>
        <div id="bildunterschrift">
        </div>
        Man beachte, dass die Funktion beim Bild mit der
        gleichen Nummer aufgerufen werden muß wie der passende
        Index im Array ist.

        Es sollte doch auch noch ein Bild gewechselt werden,
        oder?
        Das Problem kriegen wir auch noch hin.

        1. Also, ich habe das jetzt so gemacht, wie Du beschrieben hast.
          Irgendwo ist da nur immer noch der Wurm drin, er gibt dann links oben einfach die jeweilige Zahl (1 etc.) aus.

          Wie auch immer, ich habe jetzt leider keine Zeit mehr. Ich werd mich morgen nochmal drum kümmern, ggf. vielleicht den neuen Stand posten, sollte es nötig sein.

          Dir, Ab, vielen Dank so weit, Dein Code sieht ja an sich auch sehr vernünftig aus ;-) Werd den Fehler schon irgendwie ausmerzen morgen, wär ja gelacht ... hast mir auf jeden Fall weitergeholfen!

          Grüsse, Robin