使用屏幕阅读器自动完成自定义渲染

时间:2017-12-15 16:14:23

标签: jquery jquery-ui accessibility screen-readers jaws-screen-reader

我正在使用jQuery提供自动完成并覆盖_renderItem以呈现更多细节,但在尝试使用JAWS进行测试时,它似乎只读取data-value属性中的值:

$("#UnitName").autocomplete({
    ...
    create: function () {
        $(this).data('ui-autocomplete')._renderItem = function (ul, item) {
            return $('<li class="place-ac">')
                .attr("data-value", item.value)
                .append('<span class="placename">' + item.label + '</span> (<span class="postcode">' + item.postcode + '</span>)<span class="provider">' + place.organisation + '</span>')
                .appendTo(ul);
        }
    },
    minLength: 0,
});

导致此呈现的HTML:

<li class="place-ac ui-menu-item" data-value="61327" id="ui-id-148" tabindex="-1">
    <span class="place-name">Rear Garden</span> (<span class="postcode">XX1 1XX</span>)<span class="provider">Cherry Orchard Garage</span>
</li>

JAWS将阅读61327。有没有办法为JAWS指定一个额外的属性?

0 个答案:

没有答案