Question

我有一个jQuery UI对话框，它包含许多按钮。

我想在这些按钮上有键盘控制（制表符导航），所以在对话框的打开事件处理程序中，我将第一个按钮设置为聚焦。

我可以看到这个有效，并且还使用document.activeElement验证它，但是焦点随后被盗，其他东西得到了关注。

到这个时候，我不知道我应该怎样看到焦点，因为我没有任何进一步的钩子。

有没有人注意到类似的问题？

如果您感兴趣，我的代码是这样的（修改为添加Focus，如下所述）

在doc.ready - note 我还添加了jQuery按钮 - 但它们似乎并没有响应所有键盘事件 - 但这是一个单独的问题。

        $("#dialogSearchType").dialog
        (
            {
                bgiframe: true,
                height: 180,
                width: 350,
                modal: true,
                autoOpen: false,
                show: 'drop',
                hide: 'fold',
                buttons: { "Street": function() { HandleSearchStreetClick(); $(this).dialog("close"); },
                    "Property": function() { HandleSearchPropertyClick(); $(this).dialog("close"); }
                },
                focus: function(event, ui) { $("#btnSearchTypeProperty").focus(); }
            }
        );


    <div id="dialogSearchType" class="searchDialog" style="width: 280px; display: none" title="Search For..." onkeyup="HandleSearchTypeDialogKeyUp(event)">
        <span>What would you like to search for?</span>
        <br />                
                     <input type="button" tabindex="1" id="btnSearchTypeStreet" class="button" value="Street" onclick="HandleDialogSearchStreetClick()" />
        <input type="button" tabindex="2" id="btnSearchTypeProperty" class="button" value="Property" />           

    </div>

正如您所看到的，我一直尝试添加事件处理程序，但没有任何反应！

Answer 1

尝试使用focus event handler而不是open事件处理程序，看看是否有帮助。我认为它可能更正确，因为除非对话框是模态的，否则您可能希望默认按钮在每次对话获得焦点时获得焦点，而不仅仅是在打开时。如果这不起作用，那么我建议你将代码添加到你的问题中。

Answer 2

好的，我知道问题是什么。

对话框设置为模态。

jQuery将拦截文档级别的键盘事件，并取消它们。

我觉得很糟糕，所以我正在尝试一种解决方法来销毁这个事件处理程序并添加我自己的。

PS如果有人知道如何做到这一点，请告诉我！

Answer 3

在这里，您可以找到适合我们的有趣解决方案

jQuery UI Focus Stealing

jQuery UI Dialog窃取焦点

3 个答案: