Question

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

非常奇怪的问题，希望你们能帮忙。

我们从以下代码开始......这包含在一些像

这样的对象变量中

(<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);

有人帮忙！？

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

Answer 1

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

问题是对话框中的ajax调用没有给予足够的时间来完成执行。

配售

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

                clearInterval(intervalHandler);
            }
        }, 500);

在beginIteration电话解决所有问题之前

。

奇怪的问题我正在使用我的jQuery

1 个答案: