Comment conserver la sélection de texte lors de l'ouverture d'un dialogue jQuery

Question

En utilisant la boîte de dialogue de jQuery je suis tombé sur la bizarrerie suivant (testé FF3):

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

(texte pourrait être dans une zone de texte ou tout simplement un HTML sur la page)

Donc, pour moi, cela semble être un bug drôle (et énervant) ou une bizarrerie, mais peut-être qu'il y a 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 quelques 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 prend 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, donc vous perdez tout 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 d'ouvrir la boîte de dialogue, puis la resélectionner après le départ de la boîte de dialogue.

Je n'ai aucun 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 Keep text selection when focus changes pour plus de code]