<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>光标位置</title>
<style>
INPUT{border: 1 solid #000000}
BODY,TABLE{font-size: 10pt}
</style>
</head>
<body>
<table border="0" width="700" cellspacing="0" cellpadding="0">
<tr>
<td width="479" rowspan="7">
点击 TextArea 实现光标定位
<p>
<textarea rows="7" cols="49" id="box" onclick=tellPoint()>我怕来不及我要抱着你,直到感觉你的绉纹有了岁月的痕迹,直到视线变得模糊直到不能呼吸
为了你我愿意
动也不能动也要看着你,直到感觉你的发线有了白雪的痕迹,直到肯定你是真的直到失去力气让我们形影不离
如果全世界我也可以放弃,至少还有你值得我去珍惜而你在这里就是生命的奇迹
也许全世界我也可以忘记,就是不愿意失去你的消息你掌心的痣我总记得在哪里
我们好不容易我们身不由已,我怕时间太快不够将你看仔细,我怕时间太慢日夜担心失去你恨不得一夜之间白头永不分离
</textarea>
<script>
function movePoint()
{
var pn = parseInt(pnum.value);
if(isNaN(pn))
return;
var rng = box.createTextRange();
rng.moveStart("character",pn);
rng.collapse(true);
rng.select();
returnCase(rng)
}
function tellPoint()
{
var rng = event.srcElement.createTextRange();
rng.moveToPoint(event.x,event.y);
rng.moveStart("character",-event.srcElement.value.length)
pnum.value = rng.text.length
returnCase(rng)
}
function returnCase(rng)
{
bh.innerText = rng.boundingHeight;
bl.innerText = rng.boundingLeft;
bt.innerText = rng.boundingTop;
bw.innerText = rng.boundingWidth;
ot.innerText = rng.offsetTop;
ol.innerText = rng.offsetLeft;
t.innerText = rng.text;
}
function selectText(sp,ep)
{
sp = parseInt(sp)
ep = parseInt(ep)
if(isNaN(sp)||isNaN(ep))
return;
var rng = box.createTextRange();
rng.moveEnd("character",-box.value.length)
rng.moveStart("character",-box.value.length)
rng.collapse(true);
rng.moveEnd("character",ep)
rng.moveStart("character",sp)
rng.select();
returnCase(rng);
}
var rg = box.createTextRange();
function findText(tw)
{
if(tw=="")
return;
var sw = 0;
if(document.selection)
{
sw = document.selection.createRange().text.length;
}
rg.moveEnd("character",box.value.length);
rg.moveStart("character",sw);
if(rg.findText(tw))
{
rg.select();
returnCase(rg);
}
if(rg.text!=tw)
{
alert("已经搜索完了")
rg = box.createTextRange()
}
}
</script>
</p>
<p></p>
光标位置:<input type="text" value="0" id="pnum" size="8"> <input type="button" onclick="movePoint()" value="移动光标到指定位置">
<p></p>
选择指定范围:<input type="text" size="9" id="sbox"> -- <input type="text" size="9" id="ebox"> <input type="button" onclick="selectText(sbox.value,ebox.value)" value="选择">
<p></p>
选择查找字符 :<input type="text" value="" id="cbox" size="8"> <input type="button" onclick="findText(cbox.value)" value="查找下一个并选择">
</td>
<td width="217">boundingHeight: <span id="bh"></span></td>
</tr>
<tr>
<td width="217">boundingWidth: <span id="bw"></span></td>
</tr>
<tr>
<td width="217">boundingTop: <span id="bt"></span></td>
</tr>
<tr>
<td width="217">boundingLeft: <span id="bl"></span></td>
</tr>
<tr>
<td width="217">offsetLeft: <span id="ol"></span> </td>
</tr>
<tr>
<td width="217">offsetTop: <span id="ot"></span> </td>
</tr>
<tr>
<td width="217">text: <span style="position: absolute; z-index: 10" id="t"></span> </td>
</tr>
</table>
</body>
</html>
分享到:
相关推荐
首先,`createTextRange()` 是针对特定元素(如 `input` 或 `div`)调用的,返回一个表示该元素内文本的 `TextRange` 对象。例如: ```javascript var rng = document.getElementById("myElement").createTextRange...
在上面的代码中,首先通过`createTextRange()`方法创建了一个TextRange对象,然后调用`move()`方法将文本光标移动到用户指定的字符位置。`move()`方法第一个参数指定了移动的单位,这里是"character"(字符),第二...
### TextRange对象与Selection对象详解 #### 一、概述 在早期的Internet Explorer浏览器中,为了方便用户在网页上操作文本(例如复制、粘贴、查找等),开发了一套独特的对象模型来支持这些功能,其中两个核心对象...
一、返回createTextRange的text和htmlText [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 二、获取指定文本框中的选中的文字:只响应第一个文本框 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 三、页面...
首先,需要获取文本框的对象,然后使用 `select()` 方法选择对象,最后使用 `execCommand("Copy")` 方法执行扫描器复制指令。 二、复制专题地址和 URL 地址,传给 MSN 上的好友 本方法使用 `clipboardData` 对象来...
该函数使用 ActiveXObject 对象来创建 WORD 应用程序,然后使用 createTextRange() 方法来选择要导出的页面区域,并使用 execCommand("Copy") 方法将其复制到 WORD 文档中。 AllAreaExcel() 函数用于将指定的页面...
尽管在现代浏览器中DOM Range对象更常见,但TextRange对象在处理特定的文本操作时仍然有价值,尤其是在兼容旧版IE浏览器的场景下。 TextRange对象提供了一系列的方法,如`select()`用于选取文本,`collapse()`用于...
对于IE浏览器,可以使用`createTextRange()`方法创建一个范围对象,并通过一系列方法来移动光标到指定位置: ```javascript function setCaretPosition(ctrl, pos) { if (ctrl.setSelectionRange) { ctrl.focus()...
var r = e.createTextRange(); r.moveStart('character', e.value.length); r.collapse(true); r.select(); } ()"> ``` **解释**:此代码段用于自动将光标定位到文本框的末尾。这对于需要用户立即输入内容的...
8. **防止页面被嵌入框架**:通过检查`window`对象与`top`对象是否相等,可以确保页面始终作为顶级窗口加载,防止被其他框架包含。 9. **防止被frame**:类似的,使用`if (top.location != self.location)`检查,...
首先,它创建了一个Word对象,然后使用`createTextRange()`和`select()`选择整个HTML表单的内容,执行`execCommand("Copy")`进行复制。接着,在Word文档中创建一个新的Range对象,并使用`Paste()`粘贴复制的内容。...
然后,通过`document.body.createTextRange()`方法创建一个文本范围对象,该对象能够用于选择和复制页面上的文本。这里选择了ID为`PrintA`的表格元素,并将其内容复制到剪贴板中。最后,在Excel的工作表中粘贴这些...
`createTextRange()`方法创建TextRange对象,`getBookmark()`和`moveToBookmark(bookmark)`用于保存和恢复Range的位置。 3. **findText()方法**:IE特有的方法,用于在文本中查找指定的字符串,并返回找到的文本...
- **知识点**: `createTextRange` 方法创建了一个 `TextRange` 对象,这个对象可以用来选取文档的一部分,并提供了一些有用的方法和属性,比如 `htmlText` 属性可以获取选中文本的HTML表示形式。 4. **变量声明与...
本文将详细介绍几种使用JavaScript实现导出数据到Excel的方法,包括利用ActiveX对象的方式以及纯JavaScript的方式。 #### 方法一:使用ActiveX对象(仅适用于IE浏览器) 此方法基于Internet Explorer提供的ActiveX...
1. **利用`ActiveXObject`创建Office对象**:通过JavaScript创建Excel或Word应用程序实例。 2. **页面内容的选择与复制**:使用`createTextRange()`方法选择并复制指定元素的内容。 3. **内容粘贴至Office文档**:...
如果支持,创建一个TextRange对象,然后通过`range.collapse(false)`将光标放置在文本的末尾,最后调用`range.select()`选择整个文本范围,使光标出现在末尾。 - 如果浏览器不支持`createTextRange`(如Firefox),...