ARIA4: Űrlapmezők kötelezőként történő algoritmikus azonosítása ARIA segítségével
Alkalmazás
Szkripteket és ARIA-t alkalmazó HTML és XHTML.
Szerkesztői megjegyzés: Ez a technika akkor lesz alkalmazható, amikor az ARIA specifikációk bekerülnek a W3C ajánlások közé.
Ez a technika az alábbiakra vonatkozik:
- 1.3.1 teljesítési feltétel (Információ és relációk/összefüggések)
- 3.3.2 teljesítési feltétel (Címkék vagy utasítások)
A felhasználói programre és a segítő technológia támogatására vonatkozó megjegyzések
2007 januárjában a Windows alapon futó Firefox 1.5
és a Window-Eyes 5.5, valamint részlegesen a JAWS 8.0,
illetve az említett programok modernebb verziói
támogatták az ARIA-t. A további felhasználói
programokat és segítő technológiákat érintő támogatás
kifejlesztése folyamatban van. Mivel még nem minden
technológia támogatja az ARIA-t ezért kötelező mezők
megjelöléséhez más elégséges technikák is szükségesek.
Ez a technika a Firefox 2.0 frissítéseire támaszkodik,
annak érdekében, hogy egy elem szerepének meghatározása
nélkül használhatóvá váljon a kötelező
attribútum.
Leírás
A technika annak a demonstrálására szolgál, hogy az ARIA segítségével miként lehet algoritmikusan azonosítani a felhasználói bevitelt, vagy a kiválasztást igénylő űrlap elemeket. Az ARIA alkalmazásával kiegészítő információkkal láthatók el az algoritmikusan meghatározott elemek. A segítő technológiát alkalmazó felhasználónak ezután a felhasználói program biztosítja ezt a kiegészítő információt.
Példák
1. példa
Az alábbi példa szkript segítségével határozza meg
az űrlapelem kötelező állapotát. A névtartományokat
támogató felhasználói programok esetében a kötelező
állapot a setAttributeNS()(API)
alkalmazás
segítségével rendelhető az elemhez. Más felhasználói
programoknál a setAttribute()
API
használatával lehet a kötelező állapotot beállítani,
míg a névtartomány a kötelező
attribútum
kezdetéhez adott statikus szöveg sztring segítségével
szimulálható.
Az alsó példában egy tömbváltozat, requiredIds,
került elkészítésre a kötelezőként megjelölt elemek
azonosítóival. A setRequired()
funkciót az
ablak onload
eseménye aktiválja.
A setRequired()
funkció megvizsgálja a
rendelkezésre álló azonosítókat, kikeresi az elemeket
és a setAttrNS()
funkcióval igazra állítja
a kötelező állapotot.
A setAttrNS()
funkció, amennyiben
elérhető, a setAttributeNS()
API funkciót
aktiválja az attribútum beállítása érdekében. Ennek
során a States and Properties Module for Accessible
Rich Internet Applications (ARIA States and Properties)
című részhez a megfelelő névtartomány URI-t, http://www.w3.org/2005/07/aaa,
alkalmazza. Abban az esetben, ha a felhasználói program
nem rendelkezik a setAttributeNS()
API-val, akkor a szükséges attribútum névhez az "aaa:"
statikus szimulált névtartomány kerül hozzáadásra, és a
setAttribute()
API segítségével kerül
beállításra.
Az oldal Firefox 2.0 vagy Window-Eyes 5.5, illetve ezek modernebb változataival történő letöltése esetén a Window-Eyes a beviteli mező címkéjének értelmezésekor kiejti a "kötelező" szót.
Példa kód:
<head>
<script type="text/javascript">
//<![CDATA[
// array or ids on the required fields on this page
var requiredIds = new Array( "firstName", "lastName");
// function that is run after the page has loaded to set the required role on each of the
//elements in requiredIds array of id values
function setRequired(){
if (requiredIds){
var field;
for (var i = 0; i< requiredIds.length; i++){
field = document.getElementById(requiredIds[i]);
setAttrNS(field, "required", "true");
}
}
}
// method to set the attribute values based on the capability of the browser.
// Use setAttributeNS if it is available,
// otherwise append a namespace indicator string to the attribute and set its value.
function setAttrNS(elemObj, theAttr, theValue){
if (typeof document.documentElement.setAttributeNS != 'undefined') {
elemObj.setAttributeNS("http://www.w3.org/2005/07/aaa", theAttr, theValue);
}else{
elemObj.setAttribute("aaa:" + theAttr, theValue);
}
}
window.onload=setRequired;
//]]>
</script>
</head>
<body>
<p>Please enter the following data. Required fields have been programmatically identified
as required and marked with an asterisk (*) following the field label.</p>
<form action="submit.php">
<p>
<label for="firstName">First Name *: </label><input type="text" name="firstName"
id="firstName" value="" />
<label for="lastName">Last Name *: </label><input type="text" name="lastName"
id="lastName" value="" />
</p>
</form>
</body>
Források
A források csak információs célokat szolgálnak, és csak angolul elérhetőek.
Kapcsolódó technikák
(jelenleg nincsenek)
Ellenőrzések
Folyamat
-
Töltse le az oldalt az ARIA-t támogató felhasználói programsel és/vagy segítő technológiával.
-
Navigáljon minden kötelező űrlapelemhez és ellenőrizze, hogy a "kötelező" tulajdonság hallhatóan is megnevezésre kerül.
Elvárható eredmények
- A 2. pont igaz.