Lehtede loomisel on mõnikord vajalik, et klõpsates lehele asetatud nupul, toimuks brauseris mõni autori programmeeritud sündmus. Selleks peate loodud dokumenti paigutama JavaScripti koodi ja siduma selle vajaliku nupuga. Sõltuvalt kavandatava sündmuse rakendamiseks vajaliku koodi hulgast saate nupu koodiga ühendamiseks kasutada erinevaid viise.
Juhised
Samm 1
Kõige sagedamini on JavaScripti koodikõned seotud onclicki sündmusega, see tähendab hiire vasakul nupul klõpsamisega. Kui te ei pea toimuva toimingu kirjeldamiseks palju koodi sisestama, siis saab selle kogu paigutada otse nupumärgendisse. Näiteks selleks, et programmeerida brauser nupule klõpsates lihtsat sõnumit näitama, näeks JavaScripti skript välja selline: alert ('Kood töötas!') Selleks on vaja ainult ühte lauset ja teksti. Kõike seda saab hõlpsasti asetada nupumärgendi onclicki sündmuse kirjeldusse. Sel juhul võib lehe lihtsaim HTML-kood välja näha järgmine:
Nupp koodiga
Nupp koodiga
2. samm
Keerukamat JavaScripti koodi pole otstarbekas paigutada otse nupumärgendisse. Sellest on lihtsam teha eraldi funktsioon ja panna see kõne sündmusele onclick. Näiteks võib see tunduda funktsioonina, mis näitab nupu klõpsamise aega sisaldavat akent: function getTime () {
var now = uus kuupäev ();
märguanne ("Kood töötas" + now.getHours () + ":" + now.getMinutes ());
} See tuleks asetada lehe päisesse (märgendite ja vahele). Lehe täielik kood koos selle nupuga seotud funktsiooni kutsega võib välja näha järgmine:
Funktsioonikõne nupp
funktsioon getTime () {
var now = uus kuupäev ();
märguanne ("Kood töötas" + now.getHours () + ":" + now.getMinutes ());
}
Funktsioonikõne nupp
3. samm
Sama meetodit tuleks kasutada siis, kui mitmel erineval nupul klõpsamine peaks tekitama sündmuse, mida saab kirjeldada sama JavaScripti koodiga. Näiteks saate eelmist funktsiooni veidi muuta, et lisada sõnumikasti vajutatud nupu tunnus: funktsioon getTime (btnString) {
var now = uus kuupäev ();
märguanne (btnString + "klõpsas" + now.getHours () + ":" + now.getMinutes ());
} Kolme sellise nupuga lehe täielik kood võib välja näha järgmine:
Kolm funktsioonikutsega nuppu
funktsioon getTime (btnString) {
var now = uus kuupäev ();
märguanne (btnString + "klõpsas" + now.getHours () + ":" + now.getMinutes ());
}
Esimene nupp
Teine nupp
Kolmas nupp
