Pourquoi ce code javascript / jquery simple ne peut-il pas alerter le texte sélectionné?

Je ne peux pas expliquer le comportement du code ci-dessous. Voici mon script entier

    var tmpText = ''; $(document).ready(function(){ tmpText = ''; $('#btn_bold').click(function(){alert(tmpText);}); $('textarea').bind('mouseup', function(){ tmpText = ''; if(window.getSelection){ tmpText = window.getSelection(); }else if(document.getSelection){ tmpText = document.getSelection(); }else if(document.selection){ tmpText = document.selection.createRange().text; } //tmpText = 'hello world'; alert(tmpText); }); });        

Essayez les opérations suivantes:

1) Utilisez votre souris pour mettre en évidence du texte clair dans la zone de texte. Vous remarquerez que javascript vous alerte le texte sélectionné.

2) Appuyez sur le bouton de clic. Vous remarquerez que javascript vous alertera d’une chaîne vide.

Pas de commentaire tmpText = 'hello world'; et répétez les étapes ci-dessus. Cette fois, vous remarquerez que les deux étapes 1) et 2) vous avertissent “Bonjour tout le monde”.

Comment se fait-il que lors de la première expérience, l’étape 2) ne vous alerte pas du même texte que l’étape 1)?

Je teste dans google chrome

Parce qu’il n’est pas automatiquement converti en chaîne. Lorsque vous l’appelez directement avec alert (), il exécute le toSsortingng sur celui-ci, mais lorsque vous affectez une variable à utiliser ultérieurement, il le conserve en tant qu’object de sélection et lorsque vous essayez de l’alerter ultérieurement, vous ne le supposerez probablement pas. avoir cette sélection active plus (parce que vous venez de cliquer sur le bouton).

Ajoutez toSsortingng () à la fin de chacune de ces sélections et cela devrait fonctionner comme prévu.

 if(window.getSelection){ tmpText = window.getSelection().toSsortingng(); }else if(document.getSelection){ tmpText = document.getSelection().toSsortingng(); }else if(document.selection){ tmpText = document.selection.createRange().text; } 

exemple sur jsfiddle

Je me souviens que cela a été très bien expliqué dans les pages de développement de mozilla sous le bit getSelection, si vous voulez une meilleure explication de la raison pour laquelle c’est comme cela.

EDIT: trouvé le lien vers la page sur mozilla , vérifiez ce qu’ils disent sous “Notes”.

Dans la plupart des navigateurs, la sélection dans une zone de texte (ou une entrée de texte) est gérée différemment de la sélection dans le corps principal de la page. Pour obtenir le texte sélectionné dans une zone de texte, vous pouvez utiliser les éléments suivants, qui fonctionnent dans tous les principaux navigateurs:

jsFiddle: http://jsfiddle.net/fxN7p/

Code:

 function getTextareaSelectedText(textarea) { var text = ""; if (typeof textarea.selectionStart == "number") { text = textarea.value.slice(textarea.selectionStart, textarea.selectionEnd); } else if (typeof document.selection != "none" && document.selection.type == "Text") { text = document.selection.createRange().text; } return text; } 

Salut …

vous devez convertir en chaîne la sélection … exemple

 window.getSelection().toSsortingng() 

sinon vous ne pourriez pas accéder aux données