Comment conserver la sélection de texte lors de l'ouverture d'une boîte de dialogue jQuery

Question

En utilisant le dialogue de jQuery, je suis tombé sur le caprice suivant (testé en FF3):

1. L'utilisateur sélectionne le texte
2. Dans le code, ouvrez une boîte de dialogue jQuery
3. BOGUE: le texte n'est pas sélectionné

(le texte peut être dans une zone de texte ou juste un code HTML sur la page)

Donc, pour moi, cela ressemble à un bogue drôle (et ennuyeux) ou à un caprice, mais il ya peut-être une bonne explication à cela. Et ce qui m’intéresse le plus, c’est comment conserver cette sélection de texte après l’ouverture du dialogue?

Voici du 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! 

Merci!

Answer 1

La boîte de dialogue jQuery prendra le focus de l'utilisateur (vous devriez voir l'un des boutons sélectionnés dans la boîte de dialogue). Les navigateurs n'ont qu'un seul focus, vous perdez donc ce qu'ils ont sélectionné.

Vous devez simplement récupérer les positions de début et de fin de la sélection de l'utilisateur avant de créer la boîte de dialogue, puis la resélectionner après la fermeture de la boîte de dialogue.

Je n'ai pas d'exemple de code pour obtenir et définir la sélection de l'utilisateur, mais une recherche sur le Web devrait vous en trouver.

Quelque chose comme:

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

[édité (Nickolay): voir Conserver la sélection de texte lorsque la focalisation change. pour plus de code]