/    Sign up×
Community /Pin to ProfileBookmark

Select Text By Index

Hi,
I am having a div. I wanna use javascript to select text inside.

For IE, is it possible to use createTextRange? If yes, I have a problem on doing that.

For firefox , I have never had any clue how to do it. No example online work for me.

<div id=test>
something is working please </div>

I wanna do something like function selectText(DivId, startPosition, NumOfCharacters);

Thanks a million

to post a comment
JavaScript

7 Comments(s)

Copy linkTweet thisAlerts:
@NedalsAug 05.2009 — <i>
</i>function selectText(obj,pos,num) {
var text = document.getElementById(obj).innerHTML;
alert(text.substr(pos,num));
}
Copy linkTweet thisAlerts:
@Kenneth520authorAug 05.2009 — <i>
</i>function selectText(obj,pos,num) {
var text = document.getElementById(obj).innerHTML;
alert(text.substr(pos,num));
}
[/QUOTE]


Thanks for your reply. However, can you please read the question.

I am asking how to SELECT text. Not to extract a substring.
Copy linkTweet thisAlerts:
@huckepickAug 05.2009 — with crateRange in IE and getSelection in Firefox you cannot create a selection itself but fetch the content of a selection that had been made by a user

You will not be able to make Javascript select a text on its own.

If your goal is to get the content that is described by the params you gave (obj,pos,num) then Nedals version is the way to do it.

what you could do to fake a selection is replace the content you want to highlight with "<span>content</span>" and set the css for the span in a way hat looks like a selection.

[CODE]
function selectText(obj,pos,num) {
var text = document.getElementById(obj).innerHTML;
beforeSelection = text.substr(0,pos);
selection = text.substr(pos,num);
afterSelection = text.substr(pos+num);

document.getElementById(obj).innerHTML = beforeSelection + "<span>" + selection + "</span>" + afterSelection;
}
[/CODE]


if you do that you should ensure that the spans get deleted when the user clicks somewhere in the doc to avoid confusion


cu

huckepick

PS: the replacement thing only works fine if there is only plaintext in the div

If there is html to render in it it just fails.
Copy linkTweet thisAlerts:
@Kenneth520authorAug 05.2009 — Thanks for your reply.

Can someone with more experience help me on that ? Especially on firefox ? I have the code for IE , but I can't find the way to do it in firefox.

Please... someone with more experience... please give me a hand

Here is the code how to do it in IE

<html>

<script>

function selectText(ID, start, length)

{

//Code for IE and few other

var textRange = document.body.createTextRange();
textRange.moveToElementText(document.getElementById(ID));
textRange.move("character");
textRange.moveStart("character", start);

textRange.moveEnd("character", length);
textRange.select();


}

</script>

<body >

<div id=tester >This is not a happy task. Please leave me</div>


<input value="Click Me" onclick="selectText('tester',2,3)" type="button">


</body>

</html>
Copy linkTweet thisAlerts:
@NedalsAug 05.2009 — The code I provided acomplishes the task as specified. It does NOT need to use 'textRange'

Perhaps if you were to more clearly specifiy your problem instead of providing proposed YOUR solution, you might get a little better help.
Copy linkTweet thisAlerts:
@Kenneth520authorAug 05.2009 — Nope. I want the selection action. not a substring. Please read the question carefully
Copy linkTweet thisAlerts:
@Kenneth520authorAug 05.2009 — [B]PLEASE someone with more experience on FireFox .... give me a hand[/B]
×

Success!

Help @Kenneth520 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.5,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...