Přidat otázku mezi oblíbenéZasílat nové odpovědi e-mailem 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>
Jsou zobrazeny jen nové odpovědi. Zobrazit všechny
Předmět Autor Datum
Děkují moc :-D
Leo1 01.04.2019 08:25
Leo1
Ještě kdyby jsi tak napsal, co jsi nakonec udělal.
Wikan 01.04.2019 08:27
Wikan
ctrl+c a ctrl+v to poslední, co tu dál moose :-D Mužů ještě jednu prosbu. Jak třeba tu hodnotu ze s…
Leo1 01.04.2019 09:16
Leo1
Máš ji přece v this.responseText. S ní si pak můžeš dělat, co chceš.
Wikan 01.04.2019 10:25
Wikan
Aha, už to chapu :-) Zatím jen pokusy ale pro mně bude lepší něco takoveho. <!DOCTYPE html> <html>… nový
Leo1 01.04.2019 11:21
Leo1
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.… nový
Leo1 04.04.2019 09:26
Leo1
možno je vhodnejšie do HTML napsať: <div id="obrazok"> <img src="a.png" id="a" class="" alt=""> <i… nový
Mlocik97 04.04.2019 09:41
Mlocik97
Můžete vysvětlit, jak funguje toto?( xhttp. {}; ) xhttp. { if (podminka) { document.getElementById… nový
cina kvality 04.04.2019 21:51
cina kvality
Kde jsi viděl takovou konstrukcí? To snad ani nemůže fungovat. nový
Wikan 04.04.2019 21:56
Wikan
Následující řádek za new XMLHttpRequest(); nový
cina kvality 04.04.2019 21:57
cina kvality
Na tom řádku je toho ale poněkud více. nový
Wikan 04.04.2019 21:59
Wikan
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… poslední
cina kvality 04.04.2019 22:02
cina kvality

Aha, už to chapu :-)

Zatím jen pokusy ale pro mně bude lepší něco takoveho.

<!DOCTYPE html>
<html>
<body>

<div id="demo">Žádná data :(</div>

<script>
function nactiKotel() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("demo").innerHTML =
this.responseText;
}
};
xhttp.open("GET", "shm/teplota_kotel", true);
xhttp.send();
}

setInterval(function () {
nactiKotel();
}, 10000);
</script>

</body>
</html>

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.

<script>
var cislo = 1;

if(cislo == 0){document.write("cislo je 0");
}
else{document.write("cislo je 1");
}
</script>

0 = jeden obrazek
1 = jiný obrazek

možno je vhodnejšie do HTML napsať:


<div id="obrazok">
    <img src="a.png" id="a" class="" alt="">
    <img src="b.png" id="b" class="skryt" alt="">
<div>

do CSS:


.skryt {
    display: none;
}

a v JS by ste prepínali triedy.
(ukážka v jQuery)

$("#tlacitko").on('click', function() {
    $("#a").toogleClass("skryt");
    $("#b").toogleClass("skryt");
}

Můžete vysvětlit, jak funguje toto?( xhttp. {}; )


   xhttp. {
      if (podminka) {
        document.getElementById(soubor).innerHTML =  this.responseText;
      }
    };

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:


div(id=prvky)
-span(id=teplota)
-span(id=tlaky)

následně document.querySelectorAll("#prvky > span") 
=> dá seznam 4 prvků

Zpět do poradny Odpovědět na původní otázku Nahoru