Keskustelu: Nettisivujen teko: HTML kutsuu JavaScriptiä

Täytyisi saada sellanen javascript funktion kutsu, ettei koko näyttö muutu valkoiseksi.

Elikkä rakenne on sellainen, että mulla on näitä täältä opittuja lausekkeita siitä, että kuinka saan scriptiarvoja html:n sekaan. Kyseessä oleva
funktio palauttaa nimen ukolta, jonka id = ukkolkm.

document.getElementById('nimi').innerHTML = ukot[ukkolkm].nimi;

Ja luonnollisesti html dokumentissä on viitattu tähän arvoon lauseekkeella

......
<td>käsiteltävän henkilön nimi on: "</td>
<td id ='nimi'><td>
...

Ja mitä tähän pitäisi lisätä, niin on joku nappitsydeemi, esim tämä html kielen tarjoama buttoni, joka muuttaisi tätä javascriptissäni esiityvää kokonaislukumuuttujaa ukkolkm, joka vaikuttaisi mm. tuohon 'nimi':en arvoon. Eli toisin pitäisi saada nappi "seuraava", jota painamalla ukkolkm kasvaisi yhdellä ja täten alkaen nimestä kaikki arvot muuttuisivat seuraavan ukon arvoiksi.
Mulla on siis useita viittauksia tuohon ukkolkm:än, esimerkiksi

document.getElementById('osoite').innerHTML = ukot[ukkolkm].osoite;
document.getElementById('ika').innerHTML = ukot[ukkolkm].ika;
document.getElementById('puhelinnumero').innerHTML = ukot[ukkolkm].puhelinnro;

Ja nytkö tämä ukkolkm muuttuu, niin näytöllä pitäisi tapahtua samaanaikaan monta muutosta;
osoite ei olekkaan enää vanhan jätkän osoite, vaan uuden jannun. Vastaavasti ikäkin päivittyisi, koska ukkolkm ei ole enää sama, kun ekaa kertaa. Ja näin yhtä nappia painamalla kakki nämä taulukon sarakkeet täyttyisivät uuden ukon arvoista.

Miten väsäisin tämmöisen nappitsydeenmin, niin että se estäis näytön muuttumista valkoiseksi, mutta päivittäisi silti taulukon solujen arvot.

ps. sori, otsikko tuli vähän hassuksi :)

Teet vaikka tällaisen funktion:

function seuraava() {
    ukkolkm++;

    if (ukkolkm >= ukot.length) {
        alert('Ukot loppu kesken.');
        return;
    }

    // päivitetään HTML-sivulla näkyvät tiedot
    document.getElementById('nimi').innerHTML = ukot[ukkolkm].nimi;
    document.getElementById('osoite').innerHTML = ukot[ukkolkm].osoite;
    ...
}

Ja sitten nappi:

<button type="button" onclick="seuraava()">Seuraava</button>

Oi vitsi, se toimii taas, miten on tää on mahdollista, että kaikki noi sun vinkit toimii?

Uskalsin itse vain arvailla, että joku tollanen se vois olla, ihme juttu kyllä, ettei se muuta näyttöä valkoiseksi. Ku tein tuollaisen button homman joka kutsuu funktiota, jossa on document.write, niin meni näyttö valkoiseksi ainakin siinä.

No eipä siinä, kiitokset jälleen, onpahan taas yksi huoli vähemmän sydämmellä.

Paulus M kirjoitti:

Oi vitsi, se toimii taas, miten on tää on mahdollista, että kaikki noi sun vinkit toimii?

Olet sattumalta kysynyt sellaisia asioita, joihin jopa minä osaan vastata. :)

Paulus M kirjoitti:

Ku tein tuollaisen button homman joka kutsuu funktiota, jossa on document.write, niin meni näyttö valkoiseksi ainakin siinä.

Juuri tästä syystä document.write:ä ei kannata käyttää. Jos sivu on jo latautunut, koko sisältö ylikirjoitetaan...

Hehheh.
document.write():ä ei kannata käyttää ikinä. Siitä nää suurimmat ongelmat on aina tullu.
<button type="button"... ? Mitä ton olis tarkotus esittää. Joko <input type="button" value="painike"> tai <button>painike</button>...

http://www.w3.org/TR/html4/interact/forms.html­#adef-type-BUTTON