KnowlegeZone.com, Share knowledge Gain knowledge
     

Home > JavaScript : Javascript Get Selected Text / Copy Selected Text

Article By: Saqib   Date: 9/26/2008

Javascript Get Selected Text / Copy Selected Text

Javascript Get Selected Text

<script language=javascript>
function getSelText()
{
    var txt = '';
     if (window.getSelection)
    {
        txt = window.getSelection();
             }
    else if (document.getSelection) // FireFox
    {
        txt = document.getSelection();
            }
    else if (document.selection)  // IE 6/7
    {
        txt = document.selection.createRange().text;
            }
    else return;
document.aform.selectedtext.value =  txt;
}
</script>
<input type="button" value="Get selection" onmousedown="getSelText()">
<form name=aform >
<textarea name="selectedtext" rows="5" cols="20"></textarea>
</form>

 


Share |

Comments.
Comment/Solution Posted By: Saqib Khan    Date: 9/26/2008 3:50:00 AM
I've tested above with Firefox and IE, works like a charm to copy selected text.

Comment/Solution Posted By: saqib    Date: 9/27/2008 6:33:00 PM
Simple Example (IE):

<html>

<head>
<Title>exeCommand</Title>
<Script language="javascript">

function copytext() {

var txt;
txt = document.selection.createRange()

document.getElementById("ctxt").innerHTML = txt.text


}

</script>

</head>


<Body>

Hey try to Copy some of my code here and press button next to me <input type="button" onClick="copytext()" value="Copy Text">

<br>


<span id="ctxt"></span>

</Body>

</html>

Comment/Solution Posted By: Anu    Date: 2/16/2009 9:03:00 AM
i have tested the above code, it works fine for IE 7 but not working for Mozila(version 3.0).can u help me.

Comment/Solution Posted By: Saqib    Date: 2/16/2009 3:50:00 PM
Can you post your Code?

Comment/Solution Posted By: Anu    Date: 2/18/2009 3:56:00 AM
function getSelText()
{
var txt = '';
if (window.getSelection)
{
txt = window.getSelection();

}
else if (document.getSelection)
{

txt = document.getSelection();
alert('txt:'+txt);
}
else if (document.selection)
{

txt = document.selection.createRange().text;
document.getElementById('lblMessage5').focus();
var sel=document.selection.createRange();


}
if(txt != '')
{
alert('txt:'+txt);
var hidden_control='';
hidden_control=document.getElementById('Textdrag');
hidden_control.value=txt;
insertslistTag();
}
}

Comment/Solution Posted By: Saqib    Date: 2/18/2009 11:40:00 PM
I will test your code tomorrow.

Comment/Solution Posted By: danjan    Date: 3/27/2009 11:05:00 AM
error: 'setting a property that has only a getter'

Any solution to this error? FF5.0




Comment/Solution Posted By: Mark    Date: 5/13/2009 3:29:00 PM
This solution is incomplete. What is returned is not necessarily a string. On FF3 I get an object for txt, so basic things I want to do, like testing length, does not work.

Best to do:

txt = txt.toString();

if you want uniform results before using them.

Comment/Solution Posted By: Sabir    Date: 6/24/2009 4:53:00 PM
I use the Following Code, works great.:

<script language=javascript>
function getText()
{
var txt = '';
if (window.getSelection)
{
txt = window.getSelection();
}
else if (document.getSelection)
{
txt = document.getSelection();
}
else if (document.selection)
{
txt = document.selection.createRange().text;
}
else return;
document.aform.selectedtext.value = txt;
}
</script>


<input type="button" value="Get selected Text" onmousedown="getText()">
<form name=aform >
<textarea name="selectedtext" rows="6" cols="21"></textarea>
</form>


Comment/Solution Posted By: Don    Date: 7/21/2009 8:01:00 PM
Nice snippet. I was wondering if any one was aware of a way to use this in connection with an iFrame that has external content in it ?

I had tried:
$("#iframeElement")[0].contentDocument.document.getSelection();

which is essentially
document.getElementById(iframeId).contentDocument.document.getSelection();

both of which give the following error:
Permission denied for <http://www.mydomain.com> to get property HTMLDocument.document from <http://externaldomain.com>


Any ideas would be intensely helpful

Comment/Solution Posted By: Saqib    Date: 7/22/2009 3:01:00 AM
Your iFrame is populated with a external website (not the same domain?) then its a permission error, you can only select content which is hosted within your own local envirnoment.

Comment/Solution Posted By: Ki    Date: 8/14/2009 9:50:00 AM
I am trying to get the document.getSelection() to work when I selected text within a <textarea>. It works great in IE. But in firefox, this does not seem to work for <textarea>. Any suggestions?

Comment/Solution Posted By: Eric Eggers    Date: 9/29/2009 9:43:00 PM
I found this solution to work fine in IE8, but Firefox 3.5.3 didn't like it. Firebug told me document.selection was undefined, and document.getSelection() spit back rubbish. If you can get the field where the text is selected, you can get the indexes of the start and end of the text and use them to create a substring. Have your fields define event handlers for when the mouse drag is done, or when Shift-right is released:

onkeyup="getSelectedText(this);" onmouseup="getSelectedText(this);"

The event handler would like something like this:

function getSelectedText(fieldWithSelection)
{
var selectedText = '';
if (document.selection) {
selectedText = document.selection.createRange().text;
}
else {
var startPos = fieldWithSelection.selectionStart;
var endPos = fieldWithSelection.selectionEnd;

selectedText = fieldWithSelection.value.substring(startPos, endPos);
}
//Use selectedText some way
}

And it works in IE, too.


Pages :
Post Comment or Solution   OR   Sign in using Google/Aol/Yahoo/Msn/OpenID
Your Name:  
Your Email:  
Comments:
 
Please Verify:
(Type Answer)