document.selection 的作用：获取选中然后进行相关操作
来源：互联网 发布：中企动力域名 编辑：程序博客网 时间：2024/05/18 06:54
转：http://qingfeng825.iteye.com/blog/259099
一、document.selection 介绍
document.selection 表示当前网页中的选中内容。
方法有：
clear 清除选中的内容
empty 取消选中
createRange 返回 TextRange 或 ControlRange 对象
createRangeCollection 不支持
属性有：
type 选中内容的类型
typeDetail 不支持
二、document.selection.createRange()详细介绍
document.selection.createRange() 根据当前文字选择返回 TextRange 对象，或根据控件选择返回ControlRange 对象。
配合 execCommand，在 HTML 编辑器中很有用，比如：文字加粗、斜体、复制、粘贴、创建超链接等。
例子：
Html代码 收藏代码
三、光标定位的例
Html代码 收藏代码
一、document.selection 介绍
document.selection 表示当前网页中的选中内容。
方法有：
clear 清除选中的内容
empty 取消选中
createRange 返回 TextRange 或 ControlRange 对象
createRangeCollection 不支持
属性有：
type 选中内容的类型
typeDetail 不支持
二、document.selection.createRange()详细介绍
document.selection.createRange() 根据当前文字选择返回 TextRange 对象，或根据控件选择返回ControlRange 对象。
配合 execCommand，在 HTML 编辑器中很有用，比如：文字加粗、斜体、复制、粘贴、创建超链接等。
例子：
Html代码 收藏代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>document.selection 的 createRange</title> </head> <body> <div>请选中这里的部分文字。</div> <div><input type="button" value="加粗" onclick="javascript:Bold();" /></div> <script type="text/javascript" language="javascript"> <!-- function Bold() { var r = document.selection.createRange(); r.execCommand("Bold"); } --> </script> </body> </html> 三、光标定位的例
Html代码 收藏代码
<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 实现光标定位 <textarea rows="7" cols="49" id="box" onclick=tellPoint()>我怕来不及我要抱着你，直到感觉你的绉纹有了岁月的痕迹，直到视线变得模糊直到不能呼吸 为了你我愿意 动也不能动也要看着你，直到感觉你的发线有了白雪的痕迹，直到肯定你是真的直到失去力气让我们形影不离 如果全世界我也可以放弃，至少还有你值得我去珍惜而你在这里就是生命的奇迹 也许全世界我也可以忘记，就是不愿意失去你的消息你掌心的痣我总记得在哪里 我们好不容易我们身不由已，我怕时间太快不够将你看仔细，我怕时间太慢日夜担心失去你恨不得一夜之间白头永不分离 </textarea> <script language="javascript"> 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> 光标位置：<input type="text" value="0" id="pnum" size="8"> <input type="button" onclick="movePoint()" value="移动光标到指定位置"> 选择指定范围：<input type="text" size="9" id="sbox"> -- <input type="text" size="9" id="ebox"> <input type="button" onclick="selectText(sbox.value,ebox.value)" value="选择"> 选择查找字符 ：<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>
四、项目中用到的光标定位
Js代码 收藏代码//obj：要设置的对象 num：把光标设在那个位置 function setFocus(obj,num) { var rng=obj.createTextRange(); rng.moveStart("character", num); rng.collapse(true); rng.select(); } //改变当前页面的焦点 function updateCurrentPageFocus(){ //如果是合订书名 var obj; <c:if test="${indexingBean.isBound==0}"> obj=document.indexform.firstBookName; </c:if> <c:if test="${indexingBean.isBound==1}"> obj=document.indexform.boundBookName; </c:if> if(StringUtils.isBlank(obj.value)){ setFocus(obj,0); }else{ setFocus(obj,obj.value.length); } }
- document.selection 的作用：获取选中然后进行相关操作
- easyui datagrid 获取多条选中的数据进行操作
- 网页中获取当前选取的内容 document.getSelection,document.selection.createRange
- ff下的document.selection
- document.selection对象的介绍
- document.selection
- document.selection
- document.selection
- js获取数据库中多个id然后进行操作
- 获取 Textarea 元素当前的光标位置及document.selection.createRange()资料
- 获取Textarea 元素当前的光标位置及document.selection.createRange()资料
- document.selection 的 createRange()方法汇总
- DHTML之-----document.selection 的 createRange
- document.selection 和getSelection 的demo
- 关于document.selection对象的介绍
- Unity3D编辑器扩展（三）之对选中对象的操作（Selection类）
- document.selection.createRange方法----获取选择对象文本
- checkbox 操作【全选 获取选中的值】
- tomcat manager配置
- 存储内容总结
- js中int与string之间的转换
- Codeforces Round #132 (Div. 2)
- .NET程序脱离框架进阶 之 Embedding Mono
- document.selection 的作用：获取选中然后进行相关操作
- python 面向对象的编程
- 数据库中选最大值——两种防式，结果不同
- C warning“comparison between pointer and integer [enabled by default]”
- android中的照相机机拍照程序（含连续拍照）
- 优秀设计师应当知道的20大UI设计原则
- 80后小本科的职场心得
- Artistic Style, 一个很好用的代码格式化工具，可集成至 Source Insight.
- winform窗体特效
