Nappielementti tehdään sijoittamalla sivun body-osaan HTML-koodi
<input type="button" value="Klikkaa" id="nappi1" />
Elementin parametri type määrittelee napin, value määrittelee napin päällä olevan tekstin ja id identifioi napin yksikäsitteisesti.
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.matikki.fi/guidebook-python/brython/brython380/brython.js"></script>
<title>Brython</title>
<script type="text/python">
</script>
</head>
<body onload="brython({debug:1,indexedDB: false})">
<input type="button" value="Klikkaa" id="nappi1" />
</body>
</html>
Huomaa! Emme ole vielä lisänneet toimintoa nappiin, eli tapahtumafunktiota.
Kirjoitetaan script-osioon rivi, jossa kerromme tarvitsevamme browser-kirjastosta käyttöön oliot document ja alert.
from browser import document, alert
Tämän alle kirjoitamme yksinkertaisen funktion teeJotain
def teeJotain(event):
alert("hei")
Lopuksi identifioituun nappiin voidaan liittää tapahtumafunktio teeJotain käskyllä
document['nappi1'].bind("click", teeJotain)
Tapahtuma "click" kirjoitetaan ensimmäiseksi parametriksi ja halutun tapahtumafunktion nimi toiseksi parametriksi.
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://www.matikki.fi/guidebook-python/brython/brython380/brython.js"></script>
<title>Brython</title>
<script type="text/python">
from browser import document, alert
def teeJotain(event):
alert("hei")
document['nappi1'].bind("click", teeJotain)
</script>
</head>
<body onload="brython({debug:1,indexedDB: false})">
<input type="button" value="Klikkaa" id="nappi1" />
</body>
</html>
Huomaa! funktiossa teeJotain(event) on pakollinen tapahtumaparametri. Tässä määritelty sanalla event, mutta se voi olla mikä tahansa muuttujan nimeksi kelpaava.
Kirjoita nappiin ohjelma, mikä kysyy nimeäsi ja ikääsi.
Sen jälkeen ohjelma tulostaa tervehdyksen: "Hei, xxxx ! Ikäsi on yyyy"
Voit käyttää input-käskyä kysymiseen.