如何在打开jQuery对话框时保留文本选择 [英] How to preserve text selection when opening a jQuery dialog

问题描述

使用jQuery的对话框我遇到了下面的问题（在FF3中测试过）：
$ b $ ol

用户选择文本

在代码中，打开一个jQuery对话框

BUG：文本被取消选中

< （文本可能在textarea中，或者只是在页面上的HTML）

所以，对我来说，这似乎是一个有趣的（和烦人的）错误或怪癖，但也许有一个很好的解释。
我最感兴趣的是如何在打开对话框后保留此文本选择？

以下是一些代码：

  function getSelectedText（）{
 var t; 
 if（d.getSelection）t = d.getSelection（）; 
 else if（d.selection）t = d.selection.createRange（）; 
 if（t.text！= undefined）t = t.text; 
 if（！t || t ==''）{
 var a = d.getElementsByTagName（'textarea'）; $ a 
 for（var i = 0; i< a.length; ++ i）{
 if（a [i] .selectionStart！= undefined&& a [i] .selectionStart！= a [i] .selectionEnd）{
t = a [i] .value.substring（a [i] .selectionStart，a [i] .selectionEnd）; 
休息; 
} 
} 
} 
 return t; 
 
 
 $（＃dialog）。dialog（{
 autoOpen：false，
 bgiframe：false，
 height：60，
 width：80，
 modal：false，
 show：'highlight'，
 title：'wc'}）; 
 alert（getSelectedText（））; // Text is here 
 $（＃dialog）。dialog（open）; 
 alert（getSelectedText（））; //文字不在这里选择:(该死！
  

谢谢！

jQuery对话框将获取用户的焦点（你应该看到对话框中选择的按钮之一）。浏览器只有1个焦点，所以你失去了他们所拥有的任何东西选择。

您应该在执行对话框之前检索用户选择的开始和结束位置，然后在对话框消失后重新选择它。

我没有任何获取和设置用户选择的示例代码，但是网络搜索应该会找到一些。

例如：

  $（dialog）。focus（function（）{
 //保存选区
}）。blur（function（）{
 //设置文本选择
}）; 
  

Using jQuery's dialog I came across the following quirk (tested in FF3):

1. User selects text
2. In code, open up a jQuery dialog
3. BUG: the text gets unselected

(text could be in a textarea or just an HTML on the page)

So, to me it seems like a funny (and annoying) bug or a quirk, but maybe there's a good explanation for that. And what interests me most, is how to preserve this text selection after opening the dialog?

Here's some code:

function getSelectedText() {
 var t;
 if (d.getSelection) t = d.getSelection();
 else if(d.selection) t = d.selection.createRange();
 if (t.text != undefined) t = t.text;
 if (!t || t=='') {
  var a = d.getElementsByTagName('textarea');
  for (var i = 0; i < a.length; ++i) {
   if (a[i].selectionStart != undefined && a[i].selectionStart != a[i].selectionEnd) {
    t = a[i].value.substring(a[i].selectionStart, a[i].selectionEnd);
    break;
   }   
  }   
 }   
 return t;
}

 $("#dialog").dialog({
    autoOpen: false,
    bgiframe: false,
    height: 60,
    width: 80,
    modal: false,
    show: 'highlight',
    title: 'wc'});
 alert(getSelectedText()); // Text is here      
 $("#dialog").dialog("open");
 alert(getSelectedText()); // Text is not selected here :( damn! 

Thanks!

解决方案

The jQuery dialog will take the user's focus ( you should see one of the buttons selected on the dialog ). Browsers only have 1 focus so you lose whatever they had selected.

You should just retrieve the start and end positions of the user's selection before you do the dialog, and then reselected it after the dialog goes away.

I don't have any example code for getting and setting user's selection, but a web search should find you some.

Something like :

$("dialog").focus(function() {
  // save the selection
}).blur(function() {
  // set the text selection
});

[edited (Nickolay): see Keep text selection when focus changes for more code]

这篇关于如何在打开jQuery对话框时保留文本选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！