Johdanto HTML-tapahtumiin
HyperText Markup Language (HTML) on hypertekstin kieli, joka luo web-suunnittelun. se näkyy millä tahansa selaimella. HTML-tapahtumat ovat toiminta. Jokainen napsautuksen käyttäjä saa reaktion selaimesta nimeltä Toiminto. Tätä prosessia kutsutaan tapahtumaksi.
Oletetaan, että jos verkkosivulla on yksi lomake, käyttäjä täyttää tämän lomakkeen, käyttäjä saa kaksi avainta, yhden lähetetään ja toinen peruutetaan. Kun käyttäjät painavat lähetä-painiketta, lomaketiedot tallennetaan. Peruuta peruutuspainikkeella lomaketiedot ja päivitä lomake uudelleen. Tämä painiketoiminto nimeltään tapahtuma. tämä tapahtuma riippuu käyttäjien toimista.
Erityyppiset HTML-tapahtumat
HTML5: ssä on saatavana monia tapahtumattribuutteja, jotka luokitellaan ensisijaisesti kuuteen erityyppiseen tyyppiin. Nämä ominaisuudet toimivat JavaScript-kielellä.
- Windows-tapahtumamääritteet: Tämä on tarkoitettu Windows-objektin toimintaan. Se toimii vartalotunnisteessa.
- Lomakkeen tapahtumamääritteet: Jos käyttäjä suorittaa jonkin toiminnon muodossa, kuten syöttötiedot, peruuta, lähetä, nämä tapahtumamääritteet toimivat.
- Näppäimistötapahtumamäärit: Tämä näppäimistötapahtumattribuutit, joita käytetään näppäimistön toimintaan ja käyttäjän vuorovaikutukseen.
- Hiiren tapahtumamääritteet: Hiiretapahtumattribuutti, jota käytetään hiiren toimintoihin, jotka ovat siirto, napsautus, pyörä jne.
- Leikepöydän tapahtumamääritteet: Tämä tapahtumaattribuutit, joita käytetään leikepöydän toimintoihin. Esimerkki leikattu, kopioitu, tuholainen.
- Mediatapahtumamääritteet: Tämä tapahtumaattribuutti toimii mediatiedostoissa, kuten videossa jne.
Tapahtumatunnusten kuvaus
Tässä on selitys tapahtumamääritteille, jotka annetaan alla yksityiskohtaisesti:
1. Windows-tapahtumamääritteet
|
ominaisuus |
Kuvaus |
| onafterprint | Tämä skripti toimii, vaikka asiakirjan tulostamisen jälkeen. |
| onbeforeprint | Tämä skripti toimii, vaikka ennen asiakirjan tulostamista. |
| onbeforeunload | Ennen kuin purettua asiakirjaa, tämä komentosarja toimii. |
| onerror | Asiakirjassa tapahtuu virhe, jolloin tämä tapahtuma suoritettiin. |
| onhashchange | URL-osoitteen muutoksen ankkuriosa asiakirjassa, joka aikatapahtuma suoritettiin. |
| lastina | Kun ensimmäinen verkkosivu ladataan kokonaan, tämä tapahtuma suoritettiin. |
| onmessage | Asiakirjassa viesti tapahtui tuolloin tapahtuma toteutettu. |
| onoffline | Jos verkkoyhteyttä ei ole saatavana ja selain sanoo offline-tilassa, tapahtuma suoritetaan. |
| ononline | Kun verkko on käytettävissä selaimessa, tapahtuma suoritettiin. |
| onpagehide | Tämä komentosarja toimii, jos käyttäjä ei toimi nykyisellä verkkosivulla, nykyinen sivu voidaan piilottaa. |
| onpageshow | Tämä skripti toimii silloin, kun nykyinen verkkosivu on ladattu. |
| onpopstate | Tämä skripti toimii automaattisesti selaimessa historian tilan vaihtamiseksi. |
| onresize | Tämä skripti toimii, kun ikkunan selain muuttaa kokoa. |
| onstorage | Kun käyttäjien verkkotallennustilaa päivitettiin, tapahtuma suoritettiin. |
| onunload | Joko käyttäjän nykyistä verkkosivua ei ladata tai ikkuna suljetaan, tapahtuma suoritetaan. |
2. Muodosta tapahtuman ominaisuudet
| ominaisuus | Kuvaus |
| onblur | Jotkut lomakkeen tarkistusobjektit löysivät keskittymän ja sitten tapahtuman laukaisivat. |
| OnChange | Muodon arvomuutos sitten tapahtuma potkut. |
| onfocus | Muodossa esineellä on tarkennus. Tämän objektin parissa työskentely tapahtui. |
| oninput | Käyttäjä antaa arvon syötteen muodossa, jolloin tämä tapahtuma potkut. |
| oninvalid | Tapahtuma toimii, kun elementti ei täytä ennalta määritettyjä rajoituksia. |
| onreset | Käyttäjä nollasi lomaketiedot ja sitten tapahtuma potkut. |
| onsearch | Käyttäjät etsivät vaaditusta kentästä ja sitten tapahtuma laukaistiin. |
| onselect | Käyttäjä valitsee tekstin tai tekstialueen muodossa ja sitten tapahtuma laukaistaan. |
| koodinpätkä onsubmit | Käyttäjä lähettää lomakkeen lopussa, jolloin tapahtuma potkut. |
3. Näppäimistötapahtumien määritteet
| ominaisuus | Kuvaus |
| onkeydown | Käyttäjä näppäimistön avulla paina näppäintä alas, jolloin tapahtuma toimii |
| onkeypress | Käyttäjät näppäimistön avulla painavat näppäintä ja näytön merkit siinä vaiheessa tapahtuvat. |
| onkeyup | Painamisen jälkeen avainkäyttäjä vapauttaa avaimen ja tapahtuma toimii. |
4. Hiiren tapahtumamääritteet
| ominaisuus | Kuvaus |
| klikkaamalla | Käyttäjä napsauttaa hiiren painiketta ja tapahtui tapahtuma. |
| ondblclick | Käyttäjät kaksoisnapsauttavat hiirtä, jolloin tapahtuma tapahtui. |
| onmousedown | Käyttäjä painaa hiiren painiketta elementissä, jolloin tapahtuma tapahtui. |
| onmousemove | Käyttäjä siirtää hiiren osoittimen elementin päälle, jolloin tapahtuma tapahtui. |
| onmouseout | Käyttäjä siirtää hiiren elementin ulkopuolelle, jolloin tapahtuma tapahtui. |
| onmouseover | Käyttäjä siirtää hiiren elementin päälle, jolloin tapahtuma tapahtui. |
| onmouseup | Käyttäjä vapautti hiiren painikkeen, jolloin tapahtuma tapahtui. |
| onmousewheel | Hiiren pyörän avulla vieritetään ylös ja alas elementtiä, jolloin tapahtuma tapahtui. |
| onwheel | Pyöritä niitä ylös ja alas hiiren pyörän käyttäjän avulla ja tapahtuma tapahtui. |
5. Leikepöydän tapahtumamääritteet
| ominaisuus | Kuvaus |
| oncopy | Kun tapahtuma tapahtui hiiren käyttäjien avulla kopioimaan sisältöä. |
| oncut | Hiiren käyttäjien leikkaamalla sisältöä tapahtuma tapahtui. |
| onpaste | Liittämällä sisältö hiiren käyttäjän avulla tapahtui tapahtuma. |
6. Mediatapahtumien määritteet
| ominaisuus | Kuvaus |
| onabort | Kun mediatiedostot keskeytetään lataamista ja toistamista varten, tapahtuu tapahtuma. |
| oncanplay | Kun jokin mediatiedosto on valmis toistoon, tämä liipaisin laukaistaan. |
| oncanplaythrough | Mediatiedosto on valmis toistoon puskuroimatta ja lataamatta. |
| oncuechange | Elementti muuttaa sen jälkeen tapahtuman potkut. |
| ondurationchange | Mediatiedosto muuttaa ajanjakson, jolloin liipaisin vapautetaan. |
| onemptied | Jos mediatiedostoa ei ole saatavana ja tapahtuu kohtalokas virhe, liipaisin laukeaa. |
| onended | Mediatiedosto tulee päätepisteeseen, sitten liipaisin laukeaa. |
| onerror | Kun tapahtui virhe mediatiedoston hakemisessa, liipaisin laukeaa |
| onloadeddata | Mediatiedosto lataa tiedot, jolloin liipaisin vapautetaan. |
| onloadedmetadata | Mediatiedosto lataa metatiedot, liipaisin laukaistaan. |
| onloadstart | Mediatiedosto alkaa latautua, sitten liipaisin vapautetaan. |
| onpause | Mediatiedosto keskeytettiin toistamiseen uudelleen, jolloin liipaisin vapautetaan. |
| onplay | Mediatiedosto, joka on valmis toistamiseen, sitten laukaisu, vapautetaan. |
| onplaying | Mediatiedosto alkaa toistaa, sitten liipaisin vapautetaan. |
| meneillään | Tämä skripti toimii, kun selain työskentelee yhteydenpidossa mediatietoihin. |
| onratechange | Jos videoiden toistonopeutta muutetaan, liipaisin laukeaa. |
| onseeked | Käyttäjät siirtyivät loppuun, muuten ohittavat videon uuden sijainnin. tämä ominaisuus on asetettu väärin. |
| onseeking | Käyttäjä haluaa siirtyä, muuten ohittaa videon uuden sijainnin. tämä ominaisuus on totta. |
| onstalled | Kun selain pysähtyy yhtäkkiä datayhteyteen, tapahtuma toimii. |
| onsuspend | Kun tarkoituksellinen verkkoselain ei saa mediatietoja, tapahtumat toimivat. |
| ontimeupdate | Kun käyttäjä muuttaa videon toistoasentoa eteen- ja taaksepäin. |
| onvolumechange | Tulostusmateriaalin voimakkuuden muuttaminen pienestä korkeaan. |
| onwaiting | Jos data lataa tietoja, nykyinen video pysähtyy puskuroinnin kanssa, jolloin tapahtuma toimii. |
johtopäätös
Html-tapahtumat ovat helppo tapa toimia ja muodostaa käyttöliittymä selainten ja käyttäjien välillä. Käyttäjät voivat saada jokaisen toiminnan reaktion vaivattomasti. Esimerkiksi; leikkaa ja kopioi leikepöydälle, siirrä ja napsauta hiirellä, painikkeet muodolle. Tapahtumat tekevät verkkosovelluksista reaaliaikaisia ja älykkäitä työjärjestelmiä.
Suositellut artikkelit
Tämä on opas HTML-tapahtumiin. Tässä keskustellaan HTML-tapahtumien, kuten ikkunat, lomake, näppäimistö ja monet muut, esittelystä ja tyypeistä sekä ominaisuuksien selittämisestä yksityiskohtaisesti. Voit myös katsoa seuraavia artikkeleita saadaksesi lisätietoja-
- Perus HTML-tunnisteet
- HTML: n edut
- HTML-muotoiset tunnisteet
- HTML-tyylisivut
- HTML-esteet
- 5 suosituinta HTML-tapahtumamääritettä esimerkillä
- Aseta taustaväri HTML-muodossa esimerkillä
- Opas erilaisiin JavaScript-tapahtumiin
- HTML-lomakkeen validointi | esimerkit