WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: IE 11 Bug? Work around?

for

From: Megginson, Jason
Date: Mar 15, 2016 12:41PM

You can consider a band-aid approach with JavaScript on page load. The following works for me. Only with IE11 detection and a disabled checkbox will a <span> be instantiated to envelop the checkbox object:

This is crude, but it could work without having to put other keyboard implementations in place if time is of the essence.

//start JS example
function someFunction(){
if (getInternetExplorerVersion()=){
var myCheckBox = document.getElementsByTagName("input");

for (var i = 0; i < myCheckBox.length; i++){
if (myCheckBox[i].type=="checkbox" && myCheckBox[i].checked){
var myNode=document.createElement("span");
var myParent=myCheckBox[i].parentNode;
myNode.setAttribute("role", "checkbox");
myNode.setAttribute("aria-checked", myCheckBox[i].checked);
myNode.setAttribute("aria-disabled", myCheckBox[i].disabled);
myNode.setAttribute("aria-labelledby", myCheckBox[i].getAttribute("aria-labelledby"))
myParent.insertBefore(myNode, myCheckBox[i]);
myNode.appendChild(myCheckBox[i]);
}
}
}
}

function getInternetExplorerVersion()
{
var rv = -1;
if (navigator.appName == 'Microsoft Internet Explorer')
{
var ua = navigator.userAgent;
var re = new RegExp("MSIE ([0-9]{1,}[.0-9]{0,})");
if (re.exec(ua) != null)
rv = parseFloat( RegExp.$1 );
}
else if (navigator.appName == 'Netscape')
{
var ua = navigator.userAgent;
var re = new RegExp("Trident/.*rv:([0-9]{1,}[.0-9]{0,})");
if (re.exec(ua) != null)
rv = parseFloat( RegExp.$1 );
}
return rv;
}
//end JS example


Jason Megginson Director, Accessibility Compliance Office (ACO)

The College Board
T 571.392.2195 | M 703.244.7755
<EMAIL REMOVED>