0

这是我在工作中分配的一个可访问性错误，其中项目不能在使用选项卡的对话框中遍历。

很奇怪的问题，希望大家帮忙。

我们从下面的代码开始......这包含在一些对象变量中，例如

(<selector>).dialog(bam.ui.dialogOptions());

在 dialogOptions 我发表了评论，这样你就可以看到我在哪里调用我的函数 .tabAccess; 这是我尝试在我的对话框中使用 tabindex 并强制它在对话框中执行我想要的操作。

dialogOptions: function (options) {
        var settings = { title: "", showScrollbar: true };
        if (options) {
            $.extend(settings, options);
        }
        return {
            height: 373,
            width: 648,
            modal: true,
            title: settings.title,
            resizable: false,
            open: function (event, ui) {
                $(this).parent().focus();
                $('html').addClass("hidden-scrollbar");
                $(event.target).html(DialogLoadingdlg);
                $(this).find("input:enabled:last").live("blur", function () { $("a.ui-dialog-titlebar-close").focus(); });
                $("span.ui-icon-closethick").html(closeImage);
/*TAB ACCESS CALLED HERE; 
ASSIGNING IT TO THE PARENT ELEMENT OF THE DIALOG CONTENT, 
THAT BEING THE DIALOG ITSELF*/
                $(this).parent().tabAccess(); 
            },
            close: function (event, ui) {
                $('.operate a').removeClass("selected");
                if (settings.showScrollbar)
                    $('html').removeClass("hidden-scrollbar");
            }
        }
    }

这是功能tabAccess

(function ($) {
$.fn.tabAccess = function () {
    return this.each(function () {
        $('a:hover, a:focus', 'input:hover', 'input.focus').css('outline', 'thin dashed grey');
        var $tabableElements = Array('A', 'INPUT');
        var $this = $(this);
        var keyName = { "tab": 9 };
        var flag = 0;
        var tabIndex = 1;
        beginIteration($this);

/*The idea behind this function is to traverse through all children of the 
dialog; as well as all their children, applying the tabindex attribute to
only the elements contained in $tabableElements defined above and skipping
the other elements*/

        function beginIteration(item) {
            item.children().each(function(index) {
                if ($.inArray($(this).attr('tagName'), $tabableElements) != -1) {
                    $(this).attr('tabindex', tabIndex);
                    tabIndex++;
                } else {
/*The code works when I put an alert in here
but it alerts every element that is not a match
for $tabableElements; so, clearly I can't keep this.

I have tried everything from setTimeout, to console.log,
but when I take this alert out, the code does not insert
tabindex into the elements I want.*/
                    alert($(this).attr('tagName');
                    beginIteration($(this));
                }
            });
        }

        $this.bind({
            keydown: function (e) {
                switch (e.keyCode) {
                    case keyName.tab:
                    {
                        e.preventDefault();

                        if (e.shiftKey) {
                            e.preventDefault();

                        }
                        break;
                    }
                }
            }
        });
    });
};
})(jQuery);

有人帮忙！？

与往常一样，提前感谢...如果您需要更多信息，请告诉我。

4

1 回答 1

0

好的，所以......问题是我在我的问题中没有提到的问题。作为记录，如果有人遇到这个问题......它可能已经在这里了，但是......

问题是对对话框的 ajax 调用没有得到足够的时间来完成其执行。

配售

var intervalHandler = setInterval(function() {
            if ($this.find('.loading').length == 0) {
                beginIteration($this);

                clearInterval(intervalHandler);
            }
        }, 500);

在beginIteration电话解决一切之前。

于 2013-05-29T01:41:42.637 回答