Javascript für Anfänger

[Mar-Thar]

Moin,

kann mir mal einer der hier zweifellos mitlesenden Kundigen kurz kundtun, wo bei der untenstehenden Funktion der Fehler ist? Ich fange gerade erst an, mich mit Javascript, JSON und Ajax zu beschäftigen und vermutlich ist das ein Klammer-/Hochkomma-Fehler beim übergeben der Variable mit dem Bildnamen. Ich steh trotzdem gerade auf dem Schlauch.

Also, gegeben: Ein Verzeichnis mit den Bildern "zyc1.png" bis "zyc15.png". Daraus soll jeweils das nächste als Fensterhintergrund gesetzt werden, quasi als Slideshow, wofür die Funktion alle paar Sekunden aufgerufen wird. Solange ich den Namen direkt übergebe, ist alles gut. Nur, wenn ich ihn in eine Variable packe, tut sich nix. Oder kann man eine URL gar nicht so als Variable nutzen?

function myFunction() {

var thisbild = "bilder/zyc"+bildNr+".png" ;

// document.body.style.background = "#1ff3f3 url('bilder/zyc7.png') no-repeat left top";
document.body.style.background = "#1ff3f3 url(thisbild) no-repeat left top";

bildNr++ ;
if(16 <= bildNr) {
bildNr = 1 } ;

}

mfg
Martin

[mcgrymelon]

document.body.style.background = "#1ff3f3 " + url(thisbild) + " no-repeat left top";

[Mar-Thar]

Äh, nee. Sowas in der Richtung kenne ich noch aus meinen GFA-Basic-Tagen und hatte die Variante natürlich ebenfalls probiert. Tut aber nix ...

mfg
Martin

[viertakter]

document.body.style.background = "#1ff3f3 url("+thisbild+") no-repeat left top"; ??

[Mar-Thar]

Yo, das war's. Danke. Sieht auf den ersten Blick ungewohnt aus, ist aber bei näherem Hinsehen eigentlich nix anderes, als das was ich kannte.

mfg
Martin

[viertakter]

Variable im String funktioniert bei JS nicht... musst ihn entsprechend „zusammenbauen“.

[Chili]

Und warum
if(16 <= bildNr) then ...
statt
if(15 < bildNr) then ...
oder noch einfacher
if(16 = bildNr) then ...
??

Und ausserdem interessant, dass die Variable beim ersten Aufruf "eigentlich" gar nicht funktionieren kann, weil bildNr ja "nichts" ist.
Keine initiale "1" oder so... Funktioniert das bei dir?
Weiterhin interessant, dass die bildNr hochgezählt wird, obwohl die function nach jedem Durchlauf beendet und die lokale Variable futsch ist. Der Wert des vorherigen Durchlauf scheint noch da zu sein...

[Chili]

Okay, letzteres habe ich durchschaut:
Beim ersten Aufruf der Funktion wird beim Anlegen der (lokalen) Variable die bis dahin nicht existente Variable bildNr mangels strict automatisch global angelegt.
Falls die nicht vor dem Funktionsaufruf schon definiert und initialisiert war.
Vermutlich ist aber genau das der Fall, was beides beantworten täte...
Dann wiederum stellt sich die Frage, warum das Hochzählen und Bild setzen überhaupt in eine Funktion ausgelagert ist.
Hm...

[Mar-Thar]

Moin,

Zitat von Chili

Okay, letzteres habe ich durchschaut:
Beim ersten Aufruf der Funktion wird beim Anlegen der (lokalen) Variable die bis dahin nicht existente Variable bildNr mangels strict automatisch global angelegt.
Falls die nicht vor dem Funktionsaufruf schon definiert und initialisiert war.

Rischtisch. Die wird Anfangs des Script-Bereichs auf "1" initialisiert.

Zitat von Chili

Vermutlich ist aber genau das der Fall, was beides beantworten täte... Dann wiederum stellt sich die Frage, warum das Hochzählen und Bild setzen überhaupt in eine Funktion ausgelagert ist. Hm...

Weil ich den Hintergrund nicht bei jedem Durchlauf gewechselt haben will sondern nur nur mit

setInterval(function(){ myFunction(); }, 60000);

alle 60 Sekunden. Neben etlichen anderen Funktionen, die jeweils nach 1-300 Sekunden aufgerufen werden und alle möglichen Datenwerte quasi in Echtzeit auf virtuellen Uhren auf den Schirm bringen. Um das mal ein bischen weiter aufzudröseln:

Ich spiele hier gerade mit den "steelseries-gauges" rum, die mir vor Jahren das erste Mal als Echtzeit-Anzeige von Wetterdaten an einem Modellflugplatz auf einem RaspberryPi-Webserver begegnet sind. Hintergedanke bei dieser Gemmelei ist, eine Webseite mit allen möglichen Motor-, Tanklevel-, Navigations-, Wetter- und Umweltparametern einigermaßen anschaulich darzustellen. Das Bild, das dann da (später mal) alle Minute als Hintergrund gesetzt werden soll, ist das zuletzt gespeicherte Bild von meiner Mast-Cam. (Die derzeit mangels aufgepflanztem Mast noch garnicht vorhanden ist, weswegen derweil andere herhalten müssen).

Ich habe zwar vor 35 Jahren mal angefangen, in Basic und Assembler auf einem Atari800 zu programmieren und mich über GFA-Basic auf dem TT und unter Windows im Laufe der Jahre bis zu zaghaften C++ Gehversuchen in der Arduino-IDE vorgetastet, aber, wie gesagt: in Bezug auf Web-Programmierung incl. HTML, css, JavaScript, JSON usw. bin ich blutiger Anfänger und fummele mich derzeit noch durch diverse Tutorials auf SelfHTML und ähnlichen Seiten.

mfg
Martin

[Mar-Thar]

Zitat von Chili

Und warum
if(16 <= bildNr) then ...
statt
if(15 < bildNr) then ...
oder noch einfacher
if(16 = bildNr) then ...
??

Naja, wie gesagt: DAS ist eine Funktion, die derzeit lediglich den Hintergrund wechselt, damit sich überhaupt irgendwas ändert. Ob das nun <15 oder <16 heißt, ist doch völlig irrelevant. Später wird sie einfach das unter dem Namen "lastPic.png" von meiner Mastkamera abgelegte Bild aktualisieren...
Die ganzen in den Instrumenten angezeigten Werte sind momentan auch nur Random-Werte, die alle 1-n Sekunden aktualisiert werden. Derzeit ist das ganze noch in einem ziemlichen Frühstadium und ich versuche zu verstehen, was da in den Demos wie funktioniert und was ich ändern muß, um es für meinen Zweck brauchbar zu machen. Learning by doing, sozusagen

mfg
Martin

[Mar-Thar]

Interessant finde ich diese Gauges, weil man sie wirklich mit sehr wenig Aufwand optisch an alle möglichen Gegebenheiten (z.B. Tag/Nacht-Modus) anpassen kann. Der Screenshot stammt von einer modifizierten Demo aus dem Github-Paket, mit der ich derzeit rumspiele.

mfg
Martin