http://wbex.ru/index.php?action=history&feed=atom&title=JavaScript_DHTML%2FHTML%2FText_Selection
JavaScript DHTML/HTML/Text Selection - История изменений
2026-04-04T22:24:06Z
История изменений этой страницы в вики
MediaWiki 1.30.0
http://wbex.ru/index.php?title=JavaScript_DHTML/HTML/Text_Selection&diff=2592&oldid=prev
в 10:02, 26 мая 2010
2010-05-26T10:02:41Z
<p></p>
<table class="diff diff-contentalign-left" data-mw="interface">
<tr style="vertical-align: top;" lang="ru">
<td colspan="1" style="background-color: white; color:black; text-align: center;">← Предыдущая</td>
<td colspan="1" style="background-color: white; color:black; text-align: center;">Версия 10:02, 26 мая 2010</td>
</tr><tr><td colspan="2" style="text-align: center;" lang="ru"><div class="mw-diff-empty">(нет различий)</div>
</td></tr></table>
http://wbex.ru/index.php?title=JavaScript_DHTML/HTML/Text_Selection&diff=2593&oldid=prev
Admin: 1 версия
2010-05-26T07:23:04Z
<p>1 версия</p>
<p><b>Новая страница</b></p><div>==Capturing a Text Selection==<br />
<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="html4strict"><br />
<HTML><br />
<HEAD><br />
<TITLE>Getting Selected Text</TITLE><br />
<SCRIPT LANGUAGE="JavaScript"><br />
var isNav4 = (navigator.appName == "Netscape" && parseInt(navigator.appVersion) == 4)<br />
var isNav4Min = (navigator.appName == "Netscape" && parseInt(navigator.appVersion) >= 4)<br />
var isIE4Min = (navigator.appName.indexOf("Microsoft") != -1 && parseInt(navigator.appVersion) >= 4)<br />
function showSelection() {<br />
if (isNav4Min) {<br />
document.forms[0].selectedText.value = document.getSelection()<br />
} else if (isIE4Min) {<br />
if (document.selection) {<br />
document.forms[0].selectedText.value =<br />
document.selection.createRange().text<br />
event.cancelBubble = true<br />
}<br />
}<br />
}<br />
if (isNav4) {<br />
document.captureEvents(Event.MOUSEUP)<br />
}<br />
document.onmouseup = showSelection<br />
</SCRIPT><br />
</HEAD><br />
<BODY><br />
<H1>Getting Selected Text</H1><br />
<HR><br />
<P>Select some text and see how JavaScript can capture the selection:</P><br />
<H2>ARTICLE I</H2><br />
<P><br />
text text text text text text text text text text text text text <br />
</P><br />
</HR><br />
<FORM><br />
<TEXTAREA NAME="selectedText" ROWS=3 COLS=40 WRAP="virtual"></TEXTAREA><br />
</FORM><br />
</BODY><br />
</HTML><br />
<br />
</source><br />
<br />
<br />
<br />
<br />
==Get selected elememnt==<br />
<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="html4strict"><br />
<html><br />
<head><br />
<script><br />
function selection2Element() {<br />
var rng = document.selection.createRange();<br />
var newHTML = "<span class="newSpan">" + rng.text + "</span>";<br />
rng.pasteHTML(newHTML);<br />
}<br />
</script><br />
</head><br />
<body><br />
<p onmouseup="selection2Element()">select me</p><br />
</body><br />
</html><br />
<br />
</source><br />
<br />
<br />
<br />
<br />
==Get selecte text in one paragraph==<br />
<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="html4strict"><br />
<html><br />
<head><br />
<script><br />
// global<br />
var selectionStart;<br />
// invoked by onselectstart<br />
function saveStart() {<br />
selectionStart = event.srcElement;<br />
}<br />
// invoked by onmouseup<br />
function selection2Element() {<br />
if (event.srcElement == selectionStart) {<br />
var rng = document.selection.createRange();<br />
var newHTML = "<span class="newSpan">" + rng.text + "</span>";<br />
rng.pasteHTML(newHTML);<br />
} else {<br />
alert("Please restrict selections to within a single paragraph.");<br />
}<br />
}<br />
</script><br />
</head><br />
<body><br />
<p onmouseup="selection2Element()" onselectstart="saveStart()">select me</p><br />
<br />
</body><br />
</html><br />
<br />
</source><br />
<br />
<br />
<br />
<br />
==Using the elementFromPoint() Method==<br />
<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="html4strict"><br />
<br />
<HTML><br />
<HEAD><br />
<TITLE>document.elementFromPoint() Method</TITLE><br />
<SCRIPT LANGUAGE="JavaScript"><br />
function showElemUnderneath() {<br />
var elem = document.elementFromPoint(event.clientX, event.clientY)<br />
document.all.mySpan.innerText = elem.id<br />
}<br />
document.onmouseover = showElemUnderneath<br />
</SCRIPT><br />
</HEAD><br />
<BODY ID="myBody"><br />
<H1 ID="header">document.elementFromPoint() Method</H1><br />
<HR ID="myHR"><br />
<P ID="instructions">Roll the mouse around the page. The coordinates<br />
of the mouse pointer are currently atop an element<BR ID="myBR">whose ID <br />
is:"<SPAN ID="mySpan" STYLE="font-weight:bold"></SPAN>".</P><br />
<FORM ID="myForm"><br />
<INPUT ID="myButton" TYPE="button" VALUE="Sample Button" onClick="">&nbsp;<br />
</FORM><br />
<TABLE BORDER=1 ID="myTable"><br />
<TR ID="tr1"><br />
<TD ID="td_A1">Cell A1</TD><br />
<TD ID="td_B1">Cell B1</TD><br />
</TR><br />
<TR ID="tr2"><br />
<TD ID="td_A2">Cell A2</TD><br />
<TD ID="td_B2">Cell B2</TD><br />
</TR><br />
<TR ID="tr3"><br />
<TD ID="td_A3">Cell A2</TD><br />
<TD ID="td_B3">Cell B2</TD><br />
</TR><br />
</TABLE><br />
<H2 ID="sec1">Section 1</H2><br />
<P ID="p1">text.</P><br />
<H2 ID="sec2">Section 2</H2><br />
<P ID="p2">text.</P><br />
<DIV ID="myDIV" STYLE="position:absolute; top:340; left:300; background-color:yellow"><br />
Here is a positioned element.</DIV><br />
</BODY><br />
</HTML><br />
<br />
</source><br />
<br />
<br />
<br />
<br />
==Using the TextEdit Property==<br />
<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="html4strict"><br />
<br />
<HTML><br />
<HEAD><br />
<TITLE>parentTextEdit Property</TITLE><br />
<SCRIPT LANGUAGE="JavaScript"><br />
function selectChunk() {<br />
var chunk, range<br />
var x = window.event.clientX<br />
var y = window.event.clientY<br />
for (var i = 0; i < document.forms[0].chunk.length; i++) {<br />
if (document.forms[0].chunk[i].checked) {<br />
chunk = document.forms[0].chunk[i].value<br />
break <br />
}<br />
}<br />
if (window.event.srcElement.parentTextEdit) {<br />
range = window.event.srcElement.parentTextEdit.createTextRange()<br />
range.collapse()<br />
range.moveToPoint(x, y)<br />
range.expand(chunk)<br />
range.select()<br />
}<br />
}<br />
</SCRIPT><br />
</HEAD><br />
<BODY BGCOLOR="white"><br />
<FORM><br />
<P>Choose how much of the paragraph is to be selected when you click anywhere in it:<BR><br />
<INPUT TYPE="radio" NAME="chunk" VALUE="character" CHECKED>Character<br />
<INPUT TYPE="radio" NAME="chunk" VALUE="word">Word<br />
<INPUT TYPE="radio" NAME="chunk" VALUE="sentence">Sentence<br />
<FONT COLOR="white">.</FONT></P><br />
</FORM><br />
<P onClick="selectChunk()"><br />
text text text text text text text text text text text text text text <br />
</P><br />
</BODY><br />
</HTML><br />
<br />
<br />
</source></div>
Admin