Garder la sélection de texte lors du changement de focus

J'ai une zone de texte normale, et une lightbox avec une saisie de texte.

Je veux garder la sélection de l'utilisateur dans la zone de texte, même lorsque l'utilisateur se concentre sur les lightbox de saisie de texte.

  1. Sélectionnez le texte dans la zone de texte normale
  2. Bascule lightbox
  3. L'accent sur lightbox entrée

À l'étape 3., l'utilisateur de la sélection de texte est rejeté. Comment cela peut-il être évité? Voir Google docs insertion de liens lightbox par exemple.

Merci 🙂

Mise à jour

Ok, Google docs utilise une iframe pour le blanc de la page de l'article, qui est la façon dont ils manipulent des sélections multiples. Quelque chose comme ceci (excusez le dégoûtant HTML):

//test.html
<html><body>
  <h1 onclick='lightbox();'>This is the main section</h1>
  <iframe src='frame.html'></iframe>
  <div id='lightbox' style='display: none; position: fixed; top: 0; left: 0; height: 100%; width: 100%; opacity: 0.8; background-color: black;'>
    <input type='text' name='url' />
  </div>
  <script type='text/javascript'>
    function lightbox() {
      document.getElementById('lightbox').style.display = 'block';
    }
  </script>
</body></html>

//frame.html
<p>This is my iframe</p>

La sélection de texte dans l'iframe est indépendant de se concentrer sur l'entrée dans la lightbox. Donc, si une partie du texte "Ceci est mon iframe' est sélectionné, puis l'album est activée et que le curseur est placé dans l'entrée, l'iframe est la sélection de texte persiste sans javascript.

Je suis en train Nickolay la suggestion de maintenant.

OriginalL'auteur nfm | 2009-10-20

  1. 6

    De Comment préserver la sélection de texte lors de l'ouverture d'un dialogue jQuery: vous devez préserver la sélection sur le flou et la restaurer sur focus:

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

    Paramètre de sélection (à partir de jQuery Définir la Position du Curseur dans la Zone de Texte):

    $.fn.selectRange = function(start, end) {
  return this.each(function() {
    if(this.setSelectionRange) {
      this.focus();
      this.setSelectionRange(start, end);
    } else if(this.createTextRange) {
      var range = this.createTextRange();
      range.collapse(true);
      range.moveEnd('character', end);
      range.moveStart('character', start);
      range.select();
    }
  });
};
$('#elem').selectRange(3,5);

    Arriver sélection: http://laboratorium.0xab.cd/jquery/fieldselection/0.1.0/test.html

    Ok, je suis enfin en train de dans cette, mais je suis coincé avec IE vs FF. Le ci-dessus est de la pure IE - n'importe qui ont des FF pointeurs?
    Qu'est-ce exactement ne fonctionne pas dans Firefox? Je ne vois pas pourquoi le premier extrait ne serait pas, juste essayé la deuxième et il fonctionne...
    Mon erreur - FF exécute la if, MSIE la else.
    Je ne suis pas sûr si votre solution fonctionne. Veuillez vérifier cette jsfiddle.net/sandeepan_nits/qpZdJ/1 La sélection à l'intérieur de la textarea ne persiste pas quand il perd le focus.
    peut-être que je ne comprends pas comment elle devrait fonctionner. Cela devrait-il être capable de persister sélection, même après l'accent est parti? Veuillez vérifier cette stackoverflow.com/questions/4484755/...

    OriginalL'auteur Nickolay