1

我在用着

  • jQuery:1.9.1
  • jqueryui:1.10.2
  • 所有浏览器都显示相同的行为 -

因此,每当有人右键单击 textarea 元素时,我都会启动一个 jquery 对话框。我注意到文本区域在右键单击时会通过活动光标获得焦点,因此我在元素上调用 blur() 以摆脱光标。

工作,没问题。

然后在对话框中,如果用户单击“编辑”,我想将光标重新放在文本区域上。我调用了 show() 和 focus() [参见下面的代码],但它并没有让焦点恢复。没有错误,除了我想要的对话框关闭之外什么也没有发生(对话框关闭,textarea 应该有一个活动光标但没有)。

下面是代码,非常感谢任何帮助,我已经尝试了几个小时。我确定了我希望工作的代码,但没有“这是问题”

HTML

这是一个 jqueryui 对话框的元素。当用户右键单击目标元素时,这将显示为对话框的内容

<div id="popupDialog">
    <input type="button" id="editRowButton" class="contextmenuButton"
           value="edit">
</div>  

在整个页面中,我都有这些文本区域,当右键单击时,将显示 jqueryui 对话框。

<textarea id="targetThatWasRightClicked" >some content in the textarea</textarea>

javascript

<!-- This handler is used to clear the dialog if anyone clicks outside the dialog.-->
<!-- Is working fine. -->
$(document).bind('click',function(){
    // if the dialog is open, close it
    if( $("#popupDialog").dialog("isOpen" ) ) {
        closeDialog();
    }
});


function closeDialog() {
    mydialog.target = null;
    $("#popupDialog").dialog("close" ); <!-- invokes the jquery close method. --> 
                                        <!-- This is working fine -->
};


<!-- is used to initialize the jqueryui dialog, also holds a reference to the -->
<!-- object that gets right-clicked as "target". -->
var mydialog = { 
    target : null,

    init : function() {
        $('#popupDialog').dialog({
            modal: true,
            dialogClass: "no-close",
            width:'auto',
            height:'auto',
            resizable: false,
            autoOpen: false
        });
}


<!-- general setup stuff when the $(document).ready(..) function is called. -->
function initSideMenu() {

    $("#editRowButton" ).button();

    $('#editRowButton').click( function() {

        <!-- THIS IS THE PROBLEM: I expect the textarea (the target) to have -->
        <!-- a blinking cursor in it after these next two commands, but it  -->
        <!-- remains unselected. -->
        mydialog.target.show();
        mydialog.target.focus();

        closeDialog();
    });

    mydialog.init();


    $("#targetThatWasRightClicked").on("contextmenu", function(e){

        var target = $(e.target);

        <!-- the right-click focussed on the textarea, so un-focus it so the -->
        <!-- cursor isn't blinking in the textarea. -->
        target.blur();

        <!-- set "target" = the right-clicked element and open a dialog box -->
        mydialog.target = target;
        $('#popupDialog').dialog('open');

        e.preventDefault();  <!-- So the browser's contextmenu doesn't appear. -->
        e.stopPropagation(); <!-- So the document click handler doesn't get called -->
                             <!-- and close the dialog. -->
    });

}
4

1 回答 1

1

尝试在焦点之前关闭对话框:

    mydialog.target.show();
    closeDialog(); 
    mydialog.target.focus();
于 2013-04-20T03:13:30.770 回答