
JavaScript
Zdravím.
Proč je u toho vždý funkční až ten posledni div?
Muže je mezi sebou popřehazovát, ale vžda jen ten poslední.
<!DOCTYPE html>
<html>
<body>
<div id="shm/teplota_obyvak"" class="data">Žádná data :(</div>
<div id="shm/teplota_koupelna" class="data">Žádná data :(</div>
<div id="shm/teplota_loznice" class="data">Žádná data :(</div>
<div id="shm/teplota_pokoj" class="data">Žádná data :(</div>
<script>
function nactiData() {
var data = document.getElementsByClassName("data");
for (var i = 0; i < data.length; i++) {
var soubor = data[i].getAttribute("id")
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById(soubor).innerHTML =
this.responseText;
}
};
xhttp.open("GET", soubor, true);
xhttp.send();
}
}
nactiData();
setInterval(function () {
nactiData();
}, 10000);
</script>
</body>
</html>
Ak zmeníš v pôvodnom programe riadok "var" na "let" v riadku "var soubor = data[i].getAttribute('id')", tak to začne fungovať.
Dôvod bol už napísaný - je to kvôli tomu, že premenné deklarované pomocou var sú naviazané na funkciu. To znamená, že premenná soubor použitá v obsluhe udalosti onreadystatechange je stále jedna a tá istá premenná pre všetky iterácie cyklu. Takže každá iterácia nastaví hodnotu premennej soubor na identifikátor požadovaného elementu a po skončení cyklu táto premenná obsahuje posledný identifikátor a obsluha udalosti sa vykonáva až po ukončení cyklu.
Osobne by som to napísal takto (XMLHttpRequest by som použil iba ak by som musel podporovať nejaký zastaralý prehliadač, ako napr. IE11 - resp. skôr by som použil polyfill a transpiler):
pravda ja debil, sám som napsal že to treba zmeniť za let, ale když som mu psal kód tak som tam dal var....
Děkují moc
Ještě kdyby jsi tak napsal, co jsi nakonec udělal.
ctrl+c a ctrl+v to poslední, co tu dál moose
Mužů ještě jednu prosbu.
Jak třeba tu hodnotu ze souboru shm/teplota_obyvak stáhnu v JS do proměnné, abych s ní v JS mohl dál pracovat?
Máš ji přece v this.responseText. S ní si pak můžeš dělat, co chceš.
Aha, už to chapu
Zatím jen pokusy ale pro mně bude lepší něco takoveho.
Akorat volat tu funkcí s parametrem nactidata("shm/teplota_kotel");
A pak zpracovat a vypsat až ve funkci setInterval
Bych měl ještě jeden dotaz.
Jak umístit na stránku obrázek tak, aby šel přes JS měnit.
Třeba takto.
0 = jeden obrazek
1 = jiný obrazek
možno je vhodnejšie do HTML napsať:
do CSS:
a v JS by ste prepínali triedy.
(ukážka v jQuery)
Můžete vysvětlit, jak funguje toto?( xhttp. {}; )
A chybí tam středník (pokud není nepovinný v dané implementaci, ale v Internet exploreru by to neprošlo)
Problém bude nejspíš v this, je někdy záludné a v určitých případech je nutné si uložit pomocnou proměnnou novethis=this a potom pracovat uvnitř funkce s novethis.
Obecně je to problematika closures, což jsou je věc týkající se toho, zda uvnitř funkce jsou dostupné proměnné z vnější (a jakým způsobem). Funkce ve své podstatě by měly operovat pouze proměnnými, které dostanou v argumentech. Ale tak to není a proto i funkce operují s proměnnými dostupnými z nadřazeného scope (zjednodušeně globální proměnné)
doporučení: není nutné dávat všem prvkům class=data, stačí je dát do nadřazeného bloku:
Kde jsi viděl takovou konstrukcí? To snad ani nemůže fungovat.
Následující řádek za new XMLHttpRequest();
Na tom řádku je toho ale poněkud více.
Aha, asi nějaká chyba parsování... Prostě mi to zamlčelo ve všech příspěvcích to, že toho je poněkud více na tom řádku... od tečka onr...change=fu(...