光标的帖子总结（Range的使用）_javascript技巧-js教程-PHP中文网

光标的帖子总结（Range的使用）_javascript技巧

php中文网

发布： 2016-05-16 19:27:53

原创

1393人浏览过

先说说TextRange 的常用方法

collapse([bStart])
移动Range的插入点
bStart true(移到开头) false(移到末尾)

findText(sText [, iSearchScope] [, iFlags])
在Range中查找sText
iSearchScope 开始位置，负数方向搜索
iFlags 2(整词匹配) 4(区别大小写)

moveStart(sUnit [, iCount])
moveEnd(sUnit [, iCount])
移动Range的开头或结尾
sUnit character(字) word(词) sentence(句) textedit(Range)
iCount 移动数量，默认为1

moveToPoint(iX, iY)
移动光标到坐标(iX,iY)

pasteHTML(sHTMLText)
替换Range中的html

scrollIntoView([bAlignToTop])
滚动使之在当前窗口显示
bAlignToTop true(Range在窗口开头) false(Range在窗口底部)

select()
选中Range

然后讲一些例子，大家也可以帮忙汇总一下，找帖子不好找，呵呵
设置光标(qiushuiwuhen)

灵感PPT

AI灵感PPT - 免费一键PPT生成工具

226

查看详情

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

设置文本选择(qiushuiwuhen)

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

取得当前坐标系列1

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

取得当前坐标系列2

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

取得当前坐标系列3(Yang)

<textarea rows="20" cols="80" id="show"> 
Alpha 滤镜 : 线形 <img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" >
 
Alpha 滤镜 :放射状<img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" >
 
Alpha 滤镜 :长方形<img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><p style="filter:Dropshadow(color=#ff0080,offx=5,offy=5.positive=0)">样式表滤镜实例</p>
 
<img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"   style="max-width:90%" alt="光标的帖子总结（Range的使用）_javascript技巧" ><img  src="images/ad.gif"  alt="光标的帖子总结（Range的使用）_javascript技巧" ><input type="button" value="运行代码" onclick="window.open().document.writeln(show.value)"><input type="button" value="取得当前坐标" onclick="window.status=GetCursorPos(show)"><script> 
function GetCursorPos(oTextArea)  
{  
s="~!@#$%^"; 
clipboardData.setData('text',s);  
oTextArea.focus();  
document.execCommand('paste');  
var ret=oTextArea.value.indexOf(s);  
document.execCommand('undo');  
return ret;  
} 
</script>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

大家都在看：

如何利用Web Components技术创建可复用的自定义HTML元素？ JavaScript Web组件开发实践 JavaScript TypeScript类型兼容解决跨多标签字符串选取时范围改变的问题 JavaScript WebSocket集群部署