jquery 对话框按钮的 tabindex

Question

我有一个使用 jQuery UI 的对话框，上面有两个按钮。

对话框内部有一些表单元素，我可以使用 TAB 键进行切换。现在无法使用 TAB 键访问"is"按钮。接缝处没有 TabIndex。

我怎样才能做到这一点？

$("#dialog").dialog({
    resizable: false,
    height: 250,
    width: 420,
    zIndex: 100,
    stack: false,
    modal: true,
    buttons: {
        "Yes": function () {
            doSomthing();
        },
        "No": function () {
            $( this ).dialog( "close" );
        }
    }
});

Answer 1

更改按钮参数以使用 jQuery.ui 的数组规范，该规范允许设置按钮的 ID 和 TabIndex 等内容以及按钮小部件支持的任何其他受支持的属性。

buttons: [
        {
            text: "Yes",
            click: function() { doSomething(); },
            tabindex: 0
        },
        {
            text: "No",
            click: function() { $(this).dialog("close") },
            tabindex: -1, //You can disable tabbing by setting it -1
            class: 'other-class-name',
            id: 'IDofButton'
        }
]

关于 jQuery.ui 版本的提示 - 版本 1.10 支持完整的按钮子集 - jQuery.ui 的先前迭代支持较小的子集 - YMMV - 我过去的方法是尝试添加元素并查看它是如何解析的- 例如，在旧版本中，类参数可能是 class*es* 并且其他一些参数可能会被忽略。