防止jQuery对话框聚焦开启器关闭

Question

如何防止jQuery对话框关闭其开启者？

我有一个很大的textarea，当打开一个对话框的时候会关注它。如果页面向下滚动到底部，则打开对话框。当对话框关闭时，jQuery UI将焦点放在textarea上，并使页面跳回到顶部。

下面是一个例子：http://jsfiddle.net/bPqF2/1/

点击锚，然后关闭对话框。

<div> 
    <a id="click-me" href="#bottom">Click me</a> 
</div> 
<div> 
    <textarea style="height: 2000px"> 
     ... 
    </textarea> 
</div> 
<div> 
    <a id="bottom" name="bottom"></a> 
</div> 

$(function() { 
    $('#click-me').click(function() { 
     $('textarea').focus(); 
     setTimeout(function() { 
      $('<div>').text('Close me please!').dialog({ 
       modal: true 
      }); 
     }); 
    }); 
}); 

jQuery的用户界面的问题的行是https://github.com/jquery/jquery-ui/blob/86eaa30994657b650b26388e87ecff679cf93a50/ui/jquery.ui.dialog.js#L181

（注：上面只是一个自动化例如，在实际使用情况下，用户滚动窗口下来，打开的对话框（通过单击使用user-select: none），并且当它关闭时，窗口跳回到顶部）。

如果看到：http://jsfiddle.net/bPqF2/9并单击文本区域，向下滚动并等待弹出窗口，当窗口关闭时窗口将滚动到顶部。

Answer 1

这个怎么样？您可以根据自己的喜好调整滚动条。您还可以滚动到文本区域结束，如果你喜欢

<div> 
    <a id="click-me" href="#bottom">Click me</a> 
</div> 
<div> 
    <textarea id="myTxtArea" style="height: 2000px"></textarea> 
</div> 
<div> 
    <a id="bottom" name="bottom"></a> 
</div> 
<div data-role="dialog" id="myDialog"></div> 

$(function() { 
    $('#click-me').click(function() { 
     var pos = $(document).scrollTop(); // get current position before focus 
     $('textarea').focus(); 
     setTimeout(function() { 
      $('#myDialog').text('Close me please!').dialog({ 
       modal: true, 
       close: function (event, ui) { 
        console.log("dialog has closed"); 
        $('#myTxtArea').blur(); 
        $("html, body").scrollTop(pos); 
       } 
      }); 
     }); 
    }); 
}); 

Here is a demo on jsFiddle

Answer 2

更改您的href="#bottom"到href="javascript:void(0);"

你为什么不加入.blur()撤消用户的对焦点textarea的？

小提琴： http://jsfiddle.net/bPqF2/8/