Problem mit getElementByID...

[WebPSM]

Ich möchte in JavaScript eine Bilder-Galerie programmieren, allerdings habe ein kleines Problem. Da ich noch Neuling in JS bin, wollte ich euch um Hilfe bitten.

Ich habe ein Beispiel hochgeladen: http://psm.art-fx.org/js-problem/
Das Problem wird deutlich, wenn man auf Galerie2 klickt und dann auf eines der beiden Vorschaubildchen (3 und 4). Leider hat die ersetzen-Funktion es nicht geschafft, dass nicht nur das Vorschaubild, sondern auch der onClick-Eintrag geändert wird. Es scheint ein Problem mit getElementByID zu geben. Der Versuch im Netz eine Lösung zu finden, war leider erfolglos.

Es wäre Klasse, wenn sich jemand meinen kleinen Code anschauen und mir einen hilfreichen Tipp geben könnte.

[MudGuard]

Hi,

Es scheint ein Problem mit getElementByID zu geben.

Ja. Diese Funktion gibt es nicht. Im Gegensatz zu getElementById.

cu,
Andreas

[WebPSM]

Hi Andreas,

es macht leider keinen Unterschied, ob ich das d groß oder klein schreibe.

Gruß, WebPSM

Hi,

Es scheint ein Problem mit getElementByID zu geben.

Ja. Diese Funktion gibt es nicht. Im Gegensatz zu getElementById.

cu,
Andreas

[Struppi]

es macht leider keinen Unterschied, ob ich das d groß oder klein schreibe.

Es macht einen grossen. Die eine Funktion existiert nicht, die andere schon.

Struppi.

[WebPSM]

Gebe ich dir recht, aber trotz der Änderung arbeitet der Code nicht so wie er soll. Woran könnte es liegen???

es macht leider keinen Unterschied, ob ich das d groß oder klein schreibe.

Es macht einen grossen. Die eine Funktion existiert nicht, die andere schon.

Struppi.

[Siramon]

Hallo WebPSM,

Gebe ich dir recht, aber trotz der Änderung arbeitet der Code nicht so wie er soll. Woran könnte es liegen???

weil du nicht alles umgesetzt hast, was dir struppie hier vorgeschlagen hat.

um bei einem objekt den onclick-event zu ändern musst du folgende syntax verwenden:
[object].onclick = function(var) { andereFunktionsaufruf('wert'); alert(var); }

wichtig ist, dass onclick _hier_ klein geschrieben wird und eine funktionszuweisung wie oben beschrieben funktioniert.

ich habe auf die schnelle keinen link gefunden der das gut erklären kann. vielleicht hilft mir da jemand weiter :-)

Grüsse
Siramon,
     ja heute mal blind

[WebPSM]

[object].onclick = function(var) { andereFunktionsaufruf('wert'); alert(var); }

Puh, kann damit nicht gerade viel anfangen. Du weisst dem onclick eine Funktion zu. Das habe ich doch auch gemacht, allerdings habe ich noch davor geschrieben, dass es sich um javascript handelt.
Mein Code:
document.getElementById("vorschau1").onclick = "javascript:wechsel('"+art+"_2.jpg',2)";

Kann mir vielleicht jemand erklären, wie ich die Zeile umschreiben muss? Nach meinem Verständnis müsste es eigentlich funktionieren. Wie gesagt, ich bin noch Anfänger in der JS-Welt.

wichtig ist, dass onclick _hier_ klein geschrieben wird und eine funktionszuweisung wie oben beschrieben funktioniert.

Hab ich geändert.

Gruß, WebPSM

[Struppi]

[object].onclick = function(var) { andereFunktionsaufruf('wert'); alert(var); }

Puh, kann damit nicht gerade viel anfangen. Du weisst dem onclick eine Funktion zu. Das habe ich doch auch gemacht, allerdings habe ich noch davor geschrieben, dass es sich um javascript handelt.
Mein Code:
document.getElementById("vorschau1").onclick = "javascript:wechsel('"+art+"_2.jpg',2)";

Du weisst dem onclick Handler lediglich einen String zu. So wie du es im HTML Code machen würdest (selbst dort ist das javascript: lediglich ein überflüssiges Label und gehört eigentlich auch nicht dorthin)

Kann mir vielleicht jemand erklären, wie ich die Zeile umschreiben muss? Nach meinem Verständnis müsste es eigentlich funktionieren. Wie gesagt, ich bin noch Anfänger in der JS-Welt.

Ich hab hier mal versucht http://javascript.jstruebig.de/exp/events.html das erklären.

Struppi.

[WebPSM]

Du weisst dem onclick Handler lediglich einen String zu. So wie du es im HTML Code machen würdest (selbst dort ist das javascript: lediglich ein überflüssiges Label und gehört eigentlich auch nicht dorthin)

Ich hab hier mal versucht http://javascript.jstruebig.de/exp/events.html das erklären.

Ich habe mal versucht nach deiner Anleitung meinen Code umzuschreiben.
Das sieht jetzt so aus (ist auch auf dem Server):

var obj=document.getElementById("vorschau1");
var bild=art+"_1.jpg";
obj.onclick = wechsel(bild,2);
obj=document.getElementById("vorschau2");
bild=art+"_2.jpg";
obj.onclick = wechsel(bild,2);

Jetzt führt er die wechsel-Funktion direkt aus, obwohl sie erst ausgeführt werden soll, wenn auf das Vorschaubild geklickt wird.
Was habe ich noch falsch gemacht?

[wahsaga]

hi,

obj.onclick = wechsel(bild,2);

Jetzt führt er die wechsel-Funktion direkt aus,

natürlich - wechsel(bild,2) ist ein funktionsaufruf.

Was habe ich noch falsch gemacht?

du bist in wesentlichen punkten von Struppis beispielcode abgewichen.

das mit function(...) ... hatte er nicht umsonst dahin geschrieben.

gruß,
wahsaga

[WebPSM]

du bist in wesentlichen punkten von Struppis beispielcode abgewichen.

Habe mir Struppis-Anleitung nochmal durchgelesen.
Gebe ich aber nur den Funktionsnamen an (ohne Klammern), wie soll ich dann die Parameter übergeben? Verstehe das nicht... :(

[Struppi]

Habe mir Struppis-Anleitung nochmal durchgelesen.
Gebe ich aber nur den Funktionsnamen an (ohne Klammern), wie soll ich dann die Parameter übergeben? Verstehe das nicht... :(

Wenn du direkt die Funktionsreferenz übergibst, ist die Antwort, das geht nicht.

Doch dafür gibt es die Variante, die dir Siramon schon gezeigt hat https://forum.selfhtml.org/?t=109752&m=686632

[object].onclick = function(param) { .... };
Struppi.

[WebPSM]

Wenn du direkt die Funktionsreferenz übergibst, ist die Antwort, das geht nicht.

Schade.

Doch dafür gibt es die Variante, die dir Siramon schon gezeigt hat https://forum.selfhtml.org/?t=109752&m=686632

[object].onclick = function(param) { .... };

Ich habe jetzt eine Variante gefunden, mit der es funktioniert.
Allerdings übergebe ich da keinen Parameter in Klammern.
Kann bitte jemand ein Beispiel posten, wie das mit Parameterübergabe funktionieren soll?

[MudGuard]

Hi,

Kann bitte jemand ein Beispiel posten, wie das mit Parameterübergabe funktionieren soll?

Eventhandler werden vom Browser aufgerufen. Da kannst Du keine eigenen Parameter übergeben lassen.

Das wurde Dir doch schon gesagt:

Wenn du direkt die Funktionsreferenz übergibst, ist die Antwort, das geht nicht.

cu,
Andreas

[WebPSM]

»» »» Kann bitte jemand ein Beispiel posten, wie das mit Parameterübergabe funktionieren soll?

Eventhandler werden vom Browser aufgerufen. Da kannst Du keine eigenen Parameter übergeben lassen.

Das wurde Dir doch schon gesagt:

Wenn du direkt die Funktionsreferenz übergibst, ist die Antwort, das geht nicht.

Ich rede nicht von Funktionsreferenzen. Sondern von ganzen Funktionen wie hier:
[object].onclick = function(param) { .... };

[Struppi]

[object].onclick = function(param) { .... };

Ich habe jetzt eine Variante gefunden, mit der es funktioniert.
Allerdings übergebe ich da keinen Parameter in Klammern.
Kann bitte jemand ein Beispiel posten, wie das mit Parameterübergabe funktionieren soll?

  
<script type="text/javascript">  
window.onload = function ()  
{  
var o = document.getElementById('test');  
var param = prompt('Parameter?');  
  
o.onclick = function(param)  
{  
alert('klick auf ' + this.id  
+ '\nParameter:' + param  
);  
}  
  
}  
</script>  
  
<div id="test"> klick mich </div>  
  

Struppi.

[Struppi]

Es wäre Klasse, wenn sich jemand meinen kleinen Code anschauen und mir einen hilfreichen Tipp geben könnte.

Naja, ein grosser Tipp wäre, mal einen anderen Browser zu verwenden, im Firefox z.b. sehe ich folgendes:
Fehler: document.getElementByID is not a function
Quelldatei: http://psm.art-fx.org/js-problem/
Zeile: 21

und wenn ich darauf klicke sehe die folgende Zeile:
document.getElementByID("vorschau1").onClick = "javascript:wechsel('"+art+"_1.jpg',2)";

1. ist die Funktion falsch geschrieben
2. ist der Event falsch geschrieben
3. ist der Wert für den Event falsch.

Struppi.

[WebPSM]

Hi Struppi,

ich verwende den Firefox (hab auch noch 3 andere Browser drauf). Ich weiss auch, dass der Fehler in dieser Zeile liegt. Leider komme ich nicht dahinter, was ich ändern muss, damit es funktioniert.
Eigentlich habe ich den Befehl so angewendet, wie es in SelfHTML beschreiben ist: http://de.selfhtml.org/javascript/objekte/document.htm#get_element_by_id

Gruß, WebPSM

Es wäre Klasse, wenn sich jemand meinen kleinen Code anschauen und mir einen hilfreichen Tipp geben könnte.

Naja, ein grosser Tipp wäre, mal einen anderen Browser zu verwenden, im Firefox z.b. sehe ich folgendes:
Fehler: document.getElementByID is not a function
Quelldatei: http://psm.art-fx.org/js-problem/
Zeile: 21

und wenn ich darauf klicke sehe die folgende Zeile:
document.getElementByID("vorschau1").onClick = "javascript:wechsel('"+art+"_1.jpg',2)";

1. ist die Funktion falsch geschrieben
2. ist der Event falsch geschrieben
3. ist der Wert für den Event falsch.

Struppi.