ARIA attributes in IE10

Question

I'm trying to set the aria-autocomplete attribute on an element using jQuery. However when IE10 is running in either IE5 Quirks mode or IE7 Standards mode it produces a Member not found error.

<input type="textbox" id="test" />​
$('#test').attr({"aria-autocomplete": "list"});​

See this jsFiddle for a demo.

I have tried various other ARIA attributes as defined here:

HTML 5: The Markup Language (ARIA Edition)

Some produce the same error, others do not.

I can't reproduce the error in IE9.

Is this a bug in IE10? jQuery? Or is there some other reason for this that I'm not understanding?

Answer 1

Poz,

This is a known bug in the IE10 browser when in compatibility mode. Please up-vote this bug ticket to increase the likelihood that it will be fixed. https://connect.microsoft.com/IE/feedback/details/774078 The ticket was submitted by the jQuery team.

Have you tried your code sample in real IE7? I tried your jsFiddle with browserstack (WinXP/IE7) and the example worked without an error.

If you were using compatibility mode to simulate testing IE7, then the good news is that using native IE7 works just fine. The bad news is there is a bug in IE10 compatibility mode.

Answer 2

This was the solution for me. In the version of Jquery that you are using, in my cas (jquery-1.7.2.js) there is one section around line 2764 that is like this:

// Use this for any attribute in IE6/7
// This fixes almost every IE6/7 issue
nodeHook = jQuery.valHooks.button = {
    get: function( elem, name ) {
        var ret;
        ret = elem.getAttributeNode( name );
        return ret && ( fixSpecified[ name ] ? ret.nodeValue !== "" : ret.specified ) ?
            ret.nodeValue :
            undefined;
    },
    set: function( elem, value, name ) {
        // Set the existing or create a new attribute node
        var ret = elem.getAttributeNode( name );
        if ( !ret ) {
            ret = document.createAttribute( name );
            elem.setAttributeNode( ret );
        }
        return ( ret.nodeValue = value + "" );
    }
};

Acoording to https://bugs.jquery.com/ticket/12577, it's a problem of compability of IE10 in IE7 mode. the solution is to change the return variable in set function:

 return ( ret.nodeValue = value + "" );
//for:
elem.setAttribute(name, value + ""); 
return (ret.value);