How to get selected text with JavaScript
I'm a little confused why doesn't this code work!
The HTML Markup:
<div id="diva"><b>Score</b> some <i>goals</i></div>
<div id="soda"></div>
The JavaScript code:
function GetSelectedText () {
if (window.getSelection) { // all browsers, except IE before version 9
var range = window.getSelection ();
alert (range.toString ());
}
else {
if (document.selection.createRange) { // Internet Explorer
var range = document.selection.createRange ();
alert (range.text);
}
}
}
var butn = document.getElementById("soda");
butn.onclick = function(){
GetSelectedText();
}
One problem that you may well be experiencing is that in some browsers (notably IE), by the time the button's click event fires, the selection has been destroyed. You can fix this by using the mousedown event instead (which still allows the selection to be destroyed, but only after the event has been handled), or by making the button unselectable.
I assume your button is not an actual button input, because this behaviour only happens for regular elements.
Demo: http://jsfiddle.net/L9bvU/1/
function getSelectedText() {
if (window.getSelection) {
txt = window.getSelection();
} else if (window.document.getSelection) {
txt =window.document.getSelection();
} else if (window.document.selection) {
txt = window.document.selection.createRange().text;
}
return txt;
}
<p onmouseup="getSelectedText(); alert(txt)">
Highlight some of this text
with the mouse select press button end release
to fire the event. </p>
This is my way. You just need to select the text end alert text or anything else.
Does anyone know how OnMouse(event) set for the entire document in html, and it does not have to be directly added to html page.
To be on the other side, as we can change the elements in firebug!>-examples
Well there are two problems with the above code. -You can't be guaranteed that
var butn = document.getElementById("soda");
will work because it may execute before the document is done loading
-When you click on another element that's not a button, the selection is lost. If you change the "soda" div to then it will work:
<div id="diva"><b>Score</b> some <i>goals</i></div>
<div id="soda" onclick="GetSelectedText()">This will NOT work</div>
<input type="button" onclick="GetSelectedText()" value="This will work"/>
However I strongly recommend you look at jQuery as the others here have advised; it will make your like a lot easier!
链接地址: http://www.djcxy.com/p/41632.html