esp8266 - Farbdarstellung

Dsa sollte mit dem ESP8266 nichts zu tun haben, denn ob der Browser den 
Code lokal von deiner Platte, oder per Netzwerk bekommt ist doch 
eigentlich egal.
Eventuell unterscheiden sich die Sicherheitseinstellungen und du sperrst 
Javascript?
Ansonsten ist auch der Code seltsam: zwei unteschiedliche Buttons mit 
gleicher ID?
Welcher soll denn dann umgefärbt werden?

Uwe hat Recht, das dürfte mit dem ESP ja rein gar nichts zu tun haben, 
das ist ja eine reine HTML/Javascript-Frage.

Bei mir (ebenfalls Firefox 49.0 irgendwas) funktioniert das Ganze 
übrigens. Bis auf den bereits von Uwe erwähnten Fehler, dass Du für zwei 
Buttons die gleiche ID verwendest - daher wird bei mir immer nur die 
Hintergrundfarbe des ersten Buttons geändert.

Der Code funktioniert tatsächlich, sowohl von der lokalen Festplatte, 
als auch von einem lokalen Server (kein ESP8266) aus aufgerufen.
Das id im zweiten Button ist überflüssig und eigentlich falsch.
Vertausche mal die Reihenfolge der Buttons und du wirst sehen warum.
Also hat es doch was mit dem ESP zu tun...
Was liefert dir der Server denn? Schau dir das mal im Firefox den 
Quelltext der Seite an. Ist das der gleiche, wie loka aufgerufen?

Uwe

@Ludwig:
document.getElementById ist JavaScript

Dein Vorschlag ist zwar korrekt, macht aber nicht, was guenter wollte. 
Er will offenbar den Button mit der Aufschrift F00 umfärben.
Also muss es bei beiden Buttons heissen 
document.GetElementById('F00')...

Die beiden gleichen ID's führen nur dazu, dass immer der erste Button 
umgefärbt wird. Deshalb gehts nicht mehr, wenn man die Buttons 
vertauscht.

Uwe

Hallo,

der ESP hat damit direkt nichts zu tun, der schickt nur raus, was D da 
eingetippt hast.
Was sagt denn der Quelltext, der wirklich übermittelt wird?
Bei Firefox z.B. mit Rechtsklick ->Seitenquelltext anzeigen.
Kommt wirlich das an, was Du meinst geschickt zu haben?

Gruß aus Berlin
Michael

Du kannst einfach prüfen, ob JavaScript im Browser aktiviert ist:

1

<noscript>Javascript ist aus!</noscript>

2

<script>document.writeln("JavaScript ist ein!");</script>

Hallo,

1

    sResponse += "<button id=""F00"" onclick=""document.getElementById('F00').style.backgroundColor = '#FF0000'"">F00</button>""";

2

    sResponse += "<button id=""F00"" onclick=""document.getElementById('F00').style.backgroundColor = '#00FF99'"">aus</button>""";

was bringt Dich zu der Meinung, "" wäre die richtige Escape-Sequence für 
das Gänsefüßchen?
10 Zeilen darüber hast Du doch die Beispiele im Sourceode wie es richtig 
ist...

Farbe geht nach dem Korrigieren bei mir, die für mich unklare 
Buttonzuordnung usw. habe ich ignoriert, nur schnell zum Test auf ein 
NodeMCU geflasht.

Gruß aus Berlin
Michael

@Günter

Das Problem ist, dass Du in Deinem Quelltext in Strings immer dann, wenn 
im HTML-Code ein Anführungszeichen erscheinen soll, "" (zwei 
Anführungszeichen) hingeschrieben hast - korrekt wäre aber \" (Backslash 
gefolgt von Anführungszeichen)

Statt

sResponse += "<button id=""F00"" 
onclick=""document.getElementById('F00').style.backgroundColor = 
'#FF0000'"">F00</button>""";

müsste es also z.B. heissen:

sResponse += "<button id=\"F00\" 
onclick=\"document.getElementById('F00').style.backgroundColor = 
'#FF0000'\">F00</button>";

@guenter (Gast)

Du bist nicht conny, oder?

Wie auch immer, in c ist Text zwischen zwei " ein Stringliteral. Ein 
Stringliteral enthält einen C-String, und ein C-String ist ein Character 
Array (Liste aus Zeichen) bei welchem das Letzte zeichen den wert 0 hat, 
und Nullbyte genannt wird. Das heist "test" enthält die Zeichen 't', 
'e', 's', 't' und '\0'. "abc" enthält 'a', 'b', 'c' und '\0'.

Wenn 2 Stringliterale nacheinanderstehen werden diese wie ein einziges 
behandelt. "test" "abc" ist identisch zu "testabc" und enthält die 
Zeichen 't', 'e', 's', 't', 'a', 'b', 'c', '\0'.

Escapesequenzen haben ein \ davor. Das Zeichen \ hat die Escapesequenz 
\\ , neue Linien haben die Escapesequenz '\n', Nullbytes '\0', etc. Eine 
Liste gibts hier: https://en.wikipedia.org/wiki/Escape_sequences_in_C

Wenn du ein " in einem String brauchst, musst du das Zeichen escapen, 
weil es sonst das Stringliteral beenden würde. Für einen String mit den 
Zeichen '"', 't', 'e', 's', 't', '\"', '\0' würde man "\"test\"" 
schreiben.

Hallo,

als Erklärung für meine "kurze" Antwort:

1

    sResponse  = "<html><head><title>Demo f&uumlr ESP8266 Steuerung</title></head><body>";

2

    sResponse += "<font color=\"#000000\"><body bgcolor=\"#d0d0f0\">";

3

    sResponse += "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=yes\">";

4

    sResponse += "<h1>Demo f&uumlr ESP8266 Steuerung</h1>";

5

    sResponse += "Funktion 1 schaltet GPIO2 und erzeugt eine serielle Ausgabe.<BR>";

6

    sResponse += "Funktion 2 erzeugt nur eine serielle Ausgabe.<BR>";

7

    sResponse += "<FONT SIZE=+1>";

8

9

// ########################################################################

10

// diesen Teil habe ich für den "Farb-Test" eingefügt

11

// ########################################################################

12

13

    sResponse += "<button id=""F00"" onclick=""document.getElementById('F00').style.backgroundColor = '#FF0000'"">F00</button>""";

14

    sResponse += "<button id=""F00"" onclick=""document.getElementById('F00').style.backgroundColor = '#00FF99'"">aus</button>""";

Im Code sind die Beispiele für das Escape ja vorhanden.
Abschauen und kurz nachdenken oder konkret nachfragen sollte doch 
eigentlich möglich sein?

Und zwar nicht nach den fehlenden Farben, sondern z.B. warum oben

1

<font color=\"#000000\"> benutzt wird.

Er hat ja am Anfang den Code gepostet, nur leider nicht den, der im 
Sketch stand.

Gruß aus Berlin
Michael