javascript - 如何将焦点设置在 jquery 确认对话框上

Question

我有一个简单的 jquery 确认对话框，并希望将焦点放在对话框本身而不是任何其他元素上。下面的代码是我所做的重点：

function showAlert() {   

                $("#dialog-confirm").dialog({
                    title: 'Main Information',
                    resizable: false,
                    height:140,
                    modal: true,
                    closeOnEscape:true,
                    buttons: {        
                        "Yes": function() {
                            document.getElementById('form1:newProfile' ).value="true";
                            if(disableSaveFlag) return false; else disableEnableSaveBtn('true');
                               $( this ).dialog( "close" );
                        },
                        "No": function() {
                            document.getElementById('form1:newProfile' ).value="false";
                            if(disableSaveFlag) return false; else disableEnableSaveBtn('true');
                            $( this ).dialog( "close" );
                        }      
                    }    
                });
                 $("#dialog-confirm").focus(); // this line sets focus on div element with given id
            }

<div id="dialog-confirm" style="display:none">  
    <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>
        Do you want to create a new profile ? 
    </p>
</div>

问题是我找不到对话框本身的“Id”来关注它。结果，焦点设置在 Div 元素上，而我的标题没有集中。

下面是我用上面的代码得到的：

Answer 1

只需按下Tab，它将聚焦对话框的第一个元素。

Answer 2

我想我们可以专注于以下事件。我只是尝试过并为我工作得很好..

onContentReady: function () {
    //select the element you want to focus here
    $(".btn-success").focus();
}

所以我的完整代码看起来像这样。在这种情况下，我将按钮集中在我的对话框上。

$.confirm({
    icon: "fas fa-check-square",
    title: " Completed!",
    content: "Action Plans Updated Successfully!",
    type: "green",
    typeAnimated: true
    buttons: {
    Complete: {
      text: "Complete",
      btnClass: "btn-success",
      action: function () {
        location.reload(true);
      },
    },
  },
  onContentReady: function () {
      $(".btn-success").focus();
  },
});