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

» acc_calendar: Saavutettava kalenteri javascriptillä (tarpeeton mutta hyödyllinen) Niquelao Kuinka sanot että se jäi? 7. heinäkuuta 2007, kirjoittanut Rumoroso —> Saavutettavuus ja javascript? acc_calendar: Saavutettava kalenteri javascriptillä (tarpeeton mutta hyödyllinen) Päivitetty 1. kesäkuuta 2008, kirjoittanut Rumoroso Lomakekentissä, joihin täytyy syöttää päivämäärä, käyttökokemuksen parantamiseksi ja samalla tietojen muodon hallinnan lisäämiseksi, voidaan 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 olivat pikemminkin työskentelyohjeita sitä rakennettaessa: Sen on oltava saavutettava eikä häiritsevä. 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ää.

Olen etsinyt tapaa, jossa ohjelmoijat, jotka haluavat toteuttaa sen verkkosivuillaan, eivät tarvitse lisä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 poistettava tavoitteet iskeä ja tienata rahaa.) Sen sisällyttäminen dokumentteihimme Ennen kaikkea on todettava, että skriptin voi hankkia suoraan lataamalla täydellisen esimerkin .

Kalenterin sisällyttäminen dokumenttiimme on yhtä yksinkertaista kuin vastaavan script-elementin sisällyttäminen head-osioon : Kalenteri latautuu kaikille tekstikentille, joihin on sisällytetty luokka ” fecha ” (jos dokumentin kieli on espanja). Päivämäärän muoto syötetään skriptin ensimmäiselle riville. Jos esimerkiksi halutaan, että päivämäärä noudattaa järjestystä päivä/kuukausi/vuosi, jättämättä nollaa päivän eteen, kun se koostuu yhdestä numerosta, ja sisällyttämällä se kuukauteen tarvittaessa, ja että vuoden muoto on 4 numeroa: var formato = ‘d/mm/yyyy’; Kuten jo mainittiin, kalenterin näyttämiseksi tekstikentän vieressä tässä on oltava luokka “fecha”, jos dokumentille ilmoitettu kieli on espanja (“date”, jos se on englanti, jne.).

Näitä luokkanimiä voi muokata, lisätä uusia muille kielille jne. suoraan skriptissä. 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 Vuosien vaihteluväli: rangX (jossa X on vuosien lukumäärä) Nykyistä päivää ei sisällytetä: todnact Käytettävissä olevien päivämäärien suodattimen käyttö: disp Entä jos lataankin input-kentät dynaamisesti AJAXilla?

Skriptissä on ominaisuus, että jos milloin tahansa uusia tekstikenttiä lisätään asynkronisesti AJAXilla, riittää, että kyseisen latauksen jälkeen kutsutaan funktiota cargaLinks(), jotta input-kenttiin liitetään kalenterin avauslinkit Ensimmäinen esimerkki Tuleva päivämäärä, muodossa d/mm/yyyy , tästä vuodesta ( class=“fecha post” ) Tuleva päivämäärä, muodossa d/mm/yyyy, tästä vuodesta ilman tätä päivää ( class=“fecha post todnact” ) Syntymäaika, muodossa d/mm/yyyy, enintään 100 vuotta ( class=“fecha prev rang100” ) seuraavien 20 vuoden päivämäärä, muodossa d/mm/yyyy, ilman tätä päivää ( class=“fecha post rang20 todnact” ) Viimeisten 15 vuoden päivämäärä, muodossa d/mm/yyyy ( class=“fecha prev rang15” ) Päivämäärä 10 vuotta taaksepäin ja eteenpäin, muodossa d/mm/yyyy ( class=“fecha rang10” ) Uusi parannus (huhtikuu 2007) Joskus saatamme haluta, että päivämäärä syötetään kolmeen tekstikenttään, yksi kullekin sen muodostavalle tiedolle.

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

Mahdollisuus tähän on lisätty. Tätä varten jatkamme kaiken hallintaa input-kentille määritettyjen luokkien avulla . Jotta ne muodostaisivat ryhmän, kolmen tekstikentän on lisättävä koodi, joka tunnistaa ne sellaiseksi.

Tämä, joka vaikuttaa hieman oudolta, ei ole sitä. Itse asiassa on lisättävä sanaan fecha, jota käytämme luokkana kaikissa kolmessa, kirjain tai numero. Niinpä esimerkiksi voisimme soveltaa kaikkiin kolmeen luokkaa “fechaA” ja välittömästi, kalenterin avauslinkin liittämisen lisäksi, ne alkaisivat käyttäytyä ryhmänä. Myöhemmin esitetään kaksi esimerkkiä, jotka näyttävät sen selvästi.

Jokaisessa kentässä on oltava luokka sen mukaan, mikä tieto siihen liitetään: Päiväkentälle luokka ” day ” Kuukausikentälle luokka ” month ” Vuosikentälle luokka ” year ” Järjestyksessä, jossa ne asetetaan, on täysi vapaus, ja kalenterin määritysluokat (vuosien lukumäärä, edelliset, seuraavat jne.) sijoitetaan ensimmäiseen käytettävään kenttään. Seuraavassa esimerkissä voi nähdä, miten se tehdään: Toinen esimerkki Seuraavien 10 vuoden päivämäärä muodossa päivä, kuukausi, vuosi: Päivä / Kuukausi / Vuosi Tärkeä huomio on aina tiedottaa käyttäjälle, mikä kenttä on mitäkin varten.

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

Esimerkissä siitä tiedotetaan edeltävässä tekstissä ja lisäksi input-kenttien etiketit sisältävät sen. Viimeisten 15 vuoden päivämäärä muodossa vuosi, kuukausi, päivä: Vuosi / Kuukausi / Päivä Tärkeä huomio on aina tiedottaa käyttäjälle, mikä kenttä on mitäkin varten.

Esimerkissä siitä tiedotetaan edeltävässä tekstissä ja lisäksi input-kenttien etiketit sisältävät sen. Päivitys (huhtikuu 2007) Skriptiä on muokattu vähentämään siitä sovellettavia tyylejä.

Nyt luotu linkki sisältää kuvan sisältönä (aiemmin se ladattiin tyylitiedostosta). Linkki luodaan välittömästi input-kentän jälkeen (label-elementin ulkopuolelle, jos se on sen sisällä) ja siinä on seuraava merkintä: Jos kyseessä on linkki päivämäärän lataamiseen kolmeen tekstikenttään, linkin luokka muuttuu ” enl_cal_group , ja se sijoitetaan ennen ensimmäistä niistä. Päivitys (7. heinäkuuta 2007) De

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.