document.selection.createRange方法

document.selection.createRange() 根据当前文字选择返回 TextRange 对象，或根据控件选择返回 ControlRange 对象。

配合 execCommand，在 HTML 编辑器中很有用，比如：文字加粗、斜体、复制、粘贴、创建超链接等。

实例一：

<textarea cols=50 rows=15>
哈哈。我们都是新生来得。大家都来相互帮助呀。这样我们才能进步，我们才能赚大钱！</textarea>
<input type=button value=选择字后点击我看看 onclick=alert(document.selection.createRange().text)>
</form>

实例二：

<body> 
<textarea name="textfield" cols="50" rows="6">就是现在文本域里有一段文字，当你选种其中几个字后点击一个按钮或者链接会弹出一个对话框，对话框的信息就是你选中的文字
哪位老大能解决的呀?请多多帮忙!!!谢谢
</textarea> 
<input type="button" value="showSelection" onclick="alert(document.selection.createRange().text)">
<input type="button" value="showclear" onclick="alert(document.selection.clear().text)">
<input type="button" value="showtype" onclick="alert(document.selection.type)"> 
<textarea name="textfield" cols="50" rows="6" onselect="alert(document.selection.createRange().text)">就是现在文本域里有一段文字，当你选种其中几个字后点击一个按钮或者链接会弹出一个对话框，对话框的信息就是你选中的文字
哪位老大能解决的呀?请多多帮忙!!!谢谢
</textarea>

</body>

实例三：选中Input中的文本

 
 
<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
function test2() 
{
var t=document.getElementById("test")
var o=t.createTextRange()
alert(o.text) 
o.moveStart("character",2) 
alert(o.text) 
o.select() 
} 
//--> 
</SCRIPT> 
<input type='text' id='test' name='test'><input type=button onclick='test2()' value='test' name='test3'>
对textarea中的内容，进行选中后，加效果
<script language="JavaScript">
<!--
function bold(){
Qr=document.selection.createRange().text;
if(!Qr || document.selection.createRange().parentElement().name!='description')
{
txt=prompt('Text to be made BOLD.','');
if(txt!=null && txt!='') document.form1.description.value+=''+txt+'';
}
else{
document.selection.createRange().text=''+document.selection.createRange().text+'';
document.selection.empty();
}
}
//-->
</script>
<input type="button" value="加粗" onclick="bold();" />
<textarea name="description" style="width: 436px; height: 296px">选中我，点击加粗</textarea>
 
实例四：javascript捕获到选中的网页中的纯文本内容
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>鼠标取词</title>
<script>
function getSel()
{
var t=window.getSelection?window.getSelection():(document.getSelection?document.getSelection():(document.selection?document.selection.createRange().text:""))
document.forms[0].selectedtext.value = t;
}
</script></head>
<body onmouseup="getSel()">
<form>
<textarea name="selectedtext" rows="5" cols="50"></textarea>
</form>
以上的代码可以捕获到选中的网页中的纯文本内容(不含HTML标签)
如果想获得包含html的内容，将document.selection.createRange().text改成document.selection.createRange().htmlText
</body>
</html>

开心过好每一天。。。。。

发表于 2009-05-31 13:51 HILL 阅读(5995) 评论(2)  编辑  收藏
 

评论
# re: document.selection.createRange方法
文本框中少一个选择事件：onselect="return Tselect()" 
自定义Tselect()函数； 
<script langvuga="javascript"> 
function Tselect(){ 
var txt=document.selection.createRange().text; 
if(txt==“hello”){ 
alert("您当前选择的内容为："+txt); 
} 
} 
</script>

转载了个js代码的更多相关文章

  1. 最新的JavaScript核心语言标准——ES6，彻底改变你编写JS代码的方式！【转载+整理】

    原文地址 本文内容 ECMAScript 发生了什么变化? 新标准 版本号6 兑现承诺 迭代器和for-of循环 生成器 Generators 模板字符串 不定参数和默认参数 解构 Destructu ...

  2. 在Java中直接调用js代码（转载）

    http://blog.csdn.net/xzyxuanyuan/article/details/8062887 JDK1.6版添加了新的ScriptEngine类,允许用户直接执行js代码. 在Ja ...

  3. 图片攻击-BMP图片中注入恶意JS代码 <转载>

    昨天看到一篇文章<hacking throung images>,里面介绍了如何在BMP格式的图片里注入JS代码,使得BMP图片既可以正常显示, 也可以运行其中的JS代码,觉得相当有趣. ...

  4. js代码大全（各种方法、属性）《转载》

      事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture();  event.sr ...

  5. JS代码的window.location属性详解

    转载:http://www.5icool.org/a/201105/a564.html 如果你稍微懂一些JS代码,一般都会知道 window.location.href 这个属性.并且用该属性获取页面 ...

  6. 超级实用且不花哨的js代码大全

    事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcEl ...

  7. 竖向折叠二级导航JS代码（可防刷新ul/li结构）

    <html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    ...

  8. JSCover+WebDriver/Selenium获得JS 代码覆盖

    我们看JSCover(http://tntim96.github.io/JSCover/manual/manual.xml)介绍及使用说明的时候,往往被图形界面所吸引.这样的方式比較适合手工操作,点击 ...

  9. node源码详解（四） —— js代码如何调用C++的函数

    本作品采用知识共享署名 4.0 国际许可协议进行许可.转载保留声明头部与原文链接https://luzeshu.com/blog/nodesource4 本博客同步在https://cnodejs.o ...

随机推荐

  1. KMP CF126B Password

    Description Asterix,Obelix和他们的临时伙伴Suffix.Prefix已经最终找到了和谐寺.然而和谐寺大门紧闭,就连Obelix的运气也没好到能打开它. 不久他们发现了一个字符 ...

  2. TaobaoVM

    作者:Andoter链接:https://www.zhihu.com/question/275665265/answer/416021488来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商 ...

  3. 物理像素，ppi，逻辑分辨率和物理分辨率

    1 明确几个概念: 物理像素:屏幕物理像素 屏幕像素密度ppi:pixels per inch,屏幕上每英寸可以显示的像素点的数量,即屏幕像素密度.顺便一提,ppi就是dpi,只不过有文章里说苹果喜欢 ...

  4. Map集合-根据宠物昵称查找宠物

    package collection; /** * 宠物类 * @author * */ public class Pet { private String name; private String ...

  5. Jenkins配置Java项目1（Java+Maven+Tomcat+SVN/Git）

    先收集几个网址,后续再自己动手过一遍 http://www.cnblogs.com/leefreeman/p/4211530.html http://www.cnblogs.com/sunzhench ...

  6. 设计模式之享元模式(PHP实现)

    github地址:https://github.com/ZQCard/design_pattern /** * 减少创建对象的数量,以减少内存占用和提高性能.这种类型的设计模式属于结构型模式, * 它 ...

  7. 【MySQL】谈谈PhxSQL的设计和实现哲学

    参考资料: http://mp.weixin.qq.com/s?__biz=MzI4NDMyNTU2Mw==&mid=2247483790&idx=1&sn=c925202df ...

  8. 【Hadoop】Hadoop MR Job工作流引擎

    Apache Oozie 是用于 Hadoop 平台的一种工作流调度引擎.该框架(如图 1 所示)使用 Oozie 协调器促进了相互依赖的重复工作之间的协调,您可以使用预定的时间或数据可用性来触发 A ...

  9. 解决中文环境下zabbix监控图形注释乱码

    zabbix监控的图形界面能够更直观的查看监控状态,当我们把zabbix的语言切换为中文的时候,会发现监控图形中一些中文参数会乱码,例如下面的效果 但是图形界面在原生的英文环境下完全没有乱码问题.为了 ...

  10. 2017.8.5 VMware的介绍与安装

    1 VMware简介 官网地址:http://www.vmware.com VMware的功能: 是一个虚拟PC的软件,可以在现有的操作系统上虚拟出一个新的硬件环境,相当于模拟出一台新的PC,以此来实 ...