Niquelao » Blogiarkisto » Saavutettava kalenteri javascriptillä (tarpeeton mutta hyödyllinen)

» Blogiarkisto » Saavutettava kalenteri javascriptillä (tarpeeton mutta hyödyllinen) Niquelao - Saavutettavuus Saavutettava kalenteri javascriptillä (tarpeeton mutta hyödyllinen) 11. helmikuuta 2007, kirjoittaja Rumoroso Lomakkeiden tekstikentissä, joihin syötetään päivämäärä, voidaan käyttökokemuksen parantamiseksi ja samalla tietojen muodon hallinnan lisäämiseksi sisällyttää kalenteri javascriptin avulla. Tiedän, kirottu sana, mutta jos se tehdään huolellisesti ja hallitusti, sillä ei tarvitse olla kielteisiä vaikutuksia standardien ja saavutettavuuden kannalta.

Tavoitteet Aluksi asetin kaksi päätavoitetta, jotka ovat pikemminkin työskentelyohjeita kalenteria rakentaessa: Sen on oltava saavutettava eikä tunkeileva. Ilman javascript-tukea kalenterin avaamismahdollisuutta ei tietenkään tarjota, mutta jos tuki on olemassa… miksi ei tehdä tuotetusta sisällöstä saavutettavaa ja käytettävää? Sen on oltava helppo toteuttaa ja käyttää. Etsin ratkaisun, jossa ohjelmoijien, jotka haluavat toteuttaa sen verkkosivuillaan, ei tarvitse lisätä ylimääräistä koodia.

Aivan kuten CSS:ssä käytetään erilaisia valitsintyyppejä (elementti-, id-, luokkavalitsimia,…) tyylien liittämiseksi dokumenttiemme eri osiin, miksi ei käyttää samaa käyttäytymisten liittämiseen? Lisäksi toissijaisina tavoitteina ovat: optimointi, yleistäminen, kansainvälistäminen,… (realistisesti ajatellen minun oli pakko poistaa tavoitteet iskemisestä ja rahan ansaitsemisesta.) Esimerkki Toiminnan tarkistamiseksi voit siirtyä esimerkkiin ja ladata sen . Sen sisällyttäminen dokumentteihimme Kalenterin sisällyttäminen dokumenttiimme on yhtä yksinkertaista kuin vastaavan script-elementin lisääminen head-osioon : Kalenteri latautuu kaikille tekstikentille, joihin on lisätty luokka “ fecha “.

Päivämäärän muoto määritetään scriptin ensimmäisellä rivillä. Jos esimerkiksi halutaan, että päivämäärä noudattaa järjestystä päivä/kuukausi/vuosi, ilman nollaa päivän edessä, kun se koostuu yhdestä numerosta, ja nollan kanssa kuukaudessa tarvittaessa: var formato = ‘d/mm/y’; Kalenterin näyttämiseksi tekstikentän vieressä tulee kentällä olla luokka “fecha”. Lisäksi kaikki mahdolliset parametrit syötetään luokkina.

Täydellinen luettelo on seuraava: Kalenterin lataus (pakollinen): fecha Päivämäärät ennen tätä päivää: prev Päivämäärät tämän päivän jälkeen: post Vuosiväli: rangX (jossa X on vuosien lukumäärä) Nykyistä päivää ei sisällytetä: todnact Edut Kalenterille voidaan lukea seuraavia etuja: Helppo käyttää ja toteuttaa. Se ei ole tunkeileva.

Koodi ja tuotettu sisältö ovat saavutettavia (merkintä, rakenne, sisältö,…) ja sitä voidaan käyttää apuvälineiden avulla (näytönlukija,…). Tässä yhteydessä on otettu huomioon, mihin kohdistus (fokus) asettuu sekä kalenterin näkyessä että sen toiminnan aikana ja sen sulkeutuessa. Kun kalenteri näytetään, kohdistus asettuu suoraan vuosivalitsimeen, ja sarkainnäppäimellä siirtyminen noudattaa loogista järjestystä siitä eteenpäin, ja kun kalenteri suljetaan (sulkemislinkin kautta tai päivämäärän valinnan jälkeen), kohdistus palaa tekstikenttään, johon kalenteri oli liitetty.

Related: UserWay — Widget de accesibilidad con plan gratuito para empezar hoy mismo.

Kalenterissa navigointi on helppoa laitteesta riippumatta. Siinä voi navigoida millä tahansa laitteella, jolla voi selata verkkoa. Sen parametrit ovat helposti muokattavissa ja sen kutsu on hyvin yksinkertainen (luokkanimien avulla).

Kieli otetaan suoraan ylätason dokumentista, ja koodiin voi lisätä uusia käännöksiä. Jos kieltä ei ole määritetty dokumentissa (mitä ei pitäisi tapahtua), oletuksena käytetään espanjaa. Tällä hetkellä se sisältää espanjan lisäksi englannin. Lisäksi se on tehty tunnistamaan amerikanenglanti, ei siksi, että sisältö muuttuisi, vaan viikonpäivien järjestyksen muuttamiseksi (sunnuntai sijoitetaan ensimmäiseksi).

Kalenteriin sovellettavat tyylit sisällytetään CSS:n kautta, joka linkitetään scriptin avulla, joten ilman javascript-tukea dokumentin lataus optimoituu, kun kyseistä tyylitiedostoa ei kutsuta. Mukaan on lisätty luokkia, jotta tyylejä voidaan soveltaa mihin tahansa taulukon soluun (aktiiviset päivät, ei-aktiiviset päivät, nykyinen päivä) sekä erityisiä tyylejä lauantaille tai sunnuntaille. Tuotettu koodi Seuraavassa esitän osan scriptin tuottamasta koodista.

Worth a look: AudioEye — Accesibilidad gestionada: automatización combinada con revisión humana.

Kuten voidaan havaita (ja kuten jo sanoin), mukaan on lisätty luokka- ja id-nimiä, jotta asettelua voidaan hallita tyylitiedoston avulla.

Yhteenveto Lopuksi… mitä tästä kalenterista voisi sanoa?… no, että “ se on tarpeeton… mutta hyödyllinen ” ja että “ sillä ei ole kielteisiä vaikutuksia saavutettavuuden kannalta “. …muuten, mikä päivä tänään on?

Kategoria: Saavutettavuus, Javascript —> 2 kommenttia juan 16. maaliskuuta 2007 tämä on erinomainen, mutta minulle ilmenee joskus virhe valitessani päivämäärää tai vaihtaessani vuosia, ja IE lakkaa toimimasta ja myös Firefoxissa. tiedätkö mikä se on? Rumoroso 21. elokuuta 2008 Tarkista, ettei se lähetä kentän sisältöä tai ettei se todellisuudessa lähetä muuttujaa.

Scripti ei vaikuta lomakkeen lähettämiseen, joten ongelma voi tulla muualta. Terveisin Voit seurata kommentteja RSS 2.0 -syötteen kautta . Voit myös jättää kommentin , tai lähettää trackbackin sivustoltasi. Edellinen artikkeli: Onnittelut TAW Seuraava artikkeli: acc_calendar v1.1 Jätä kommenttisi Kentät Nimi ja Sähköposti ovat pakollisia Lisää meidät…

Tagit, joita korostamme yleisesti saavutettavuus bert bos blockquote bug cañas lainaukset cite käyttäytyminen tietämys CSS escuas standardit fieldset Firefox muoto lomake lähteet hidden ie IE 7 tieto javascript legend lista niquelando pakollinen opera playa q squash loma w3c WCAG xhtml Tämä teos on lisensoitu Creative Commons -lisenssillä .

P.S. A few readers have asked which superposición de accesibilidad (overlay) we actually reach for — it's accessiBe; take a look here if you want the current details.