Question

我打算在页面上有多个无模式对话框。我希望当单击一个对话框时，它将获得.ui-state-focus类，并且在单击时将被删除，因此我可以轻松地设置活动/非活动对话框的样式。我基本上想改变它的边框颜色。

我正在使用jqueryUI 1.10，不幸的是我还没有看到只使用CSS来对焦/关闭对话框。

添加此功能的最佳方法是什么？我愿意基于原始对话框小部件派生出一个新的对话框小部件，但是我会很感激有关如何最好地编写代码的建议。

Answer 1

这样的事情：

$('.ui-dialog').on('click', function() {
    $('.ui-dialog').removeClass('ui-state-focus');
    $(this).addClass('ui-state-focus');
});

如果用户点击除了任何对话框以外的任何内容，则删除焦点：

$(document).on('click', function(e) {
    var $target = $(e.target);
    if(!$target.hasClass('ui-dialog') && $target.parents().hasClass('ui-dialog')) {
        $('.ui-dialog').removeClass('ui-state-focus');
    }
});

如何将注意力集中在jquery ui对话框小部件上？

1 个答案: