JS实现兼容各种浏览器的获取选择文本的方法【测试可用】


Posted in Javascript onJune 21, 2016

本文实例讲述了JS实现兼容各种浏览器的获取选择文本的方法。分享给大家供大家参考,具体如下:

运行效果截图如下:

JS实现兼容各种浏览器的获取选择文本的方法【测试可用】

具体代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>文本被选中</title>
<style type = "text/css">
 #showSelected{
 margin:100px auto;
 width:100%;
 height:200px;
 background:#ececec;
 border:1px solid #ccc;
 }
</style>
<script type = "text/javascript">
//传入要获取其中选择文本的对象
function getSelectedText(e){
  //IE下获取选择文本
  if (document.selection) {
   return document.selection.createRange().text;
  }
  //firefox下获取选择文本
  else
   if (window.getSelection().toString()) {
    return window.getSelection().toString();
   }
   //firefox下获取input或textArea域的选择文本
   else
    if (e.selectionStart != undefined && e.selectionEnd != undefined) {
     var start = e.selectionStart;
     var end = e.selectionEnd;
     return e.value.substring(start, end);
    }
}
document.onmouseup = function(){
  var ta = document.getElementById("myDiv");
  document.getElementById("showSelected").innerHTML = getSelectedText(document.body);
}
</script>
</head>
  <body>
    <div id="myDiv">
      This is a prograph for testing!
    </div>
 <div id = "showSelected"></div>
  </body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript下function声明一些小结
Dec 28 Javascript
JavaScript Object的extend是一个常用的功能
Dec 02 Javascript
jquery win 7透明弹出层效果的简单代码
Aug 06 Javascript
jquery批量控制form禁用的代码
Aug 06 Javascript
JQuery加载图片自适应固定大小的DIV
Sep 12 Javascript
javaScript如何生成xmlhttp
Dec 16 Javascript
js实现网页抽奖实例
Aug 05 Javascript
js面向对象的写法
Feb 19 Javascript
Javascript类型系统之String字符串类型详解
Jun 21 Javascript
js实现楼层效果的简单实例
Jul 15 Javascript
微信小程序模板(template)使用详解
Jan 31 Javascript
node脚手架搭建服务器实现token验证的方法
Jan 20 Javascript
JS实现兼容各种浏览器的高级拖动方法完整实例【测试可用】
Jun 21 #Javascript
JavaScript检测原始值、引用值、属性
Jun 20 #Javascript
Js 获取当前函数参数对象的实现代码
Jun 20 #Javascript
JS实现鼠标框选效果完整实例
Jun 20 #Javascript
javascript事件冒泡简单示例
Jun 20 #Javascript
JS实现的打字机效果完整实例
Jun 20 #Javascript
jQuery实现的网格线绘制方法
Jun 20 #Javascript
You might like
php mysql索引问题
2008/06/07 PHP
php include,include_once,require,require_once
2008/09/05 PHP
php简单的会话类代码
2011/08/08 PHP
php 输入输出流详解及示例代码
2016/08/25 PHP
php 调用ffmpeg获取视频信息的简单实现
2017/04/03 PHP
PHP实现微信小程序用户授权的工具类示例
2019/03/05 PHP
Laravel6.18.19如何优雅的切换发件账户
2020/06/14 PHP
CL vs ForZe BO5 第二场 2.13
2021/03/10 DOTA
jQuery 性能优化指南 (1)
2009/05/21 Javascript
Javascript通过overflow控制列表闭合与展开的方法
2015/05/15 Javascript
JS实现一个简单的日历
2017/02/22 Javascript
[js高手之路]寄生组合式继承的优势详解
2017/08/28 Javascript
JS+WCF实现进度条实时监测数据加载量的方法详解
2017/12/19 Javascript
详解Axios 如何取消已发送的请求
2018/10/20 Javascript
nodejs图片处理工具gm用法小结
2018/12/12 NodeJs
Element-ui自定义table表头、修改列标题样式、添加tooltip、:render-header使用
2019/04/11 Javascript
简单实现节流函数和防抖函数过程解析
2019/10/08 Javascript
Python 列表(List)操作方法详解
2014/03/11 Python
使用Python操作Elasticsearch数据索引的教程
2015/04/08 Python
详解Python中DOM方法的动态性
2015/04/11 Python
python逐行读写txt文件的实例讲解
2018/04/03 Python
利用django-suit模板添加自定义的菜单、页面及设置访问权限
2018/07/13 Python
python打印直角三角形与等腰三角形实例代码
2019/10/20 Python
windows环境中利用celery实现简单任务队列过程解析
2019/11/29 Python
Python为何不支持switch语句原理详解
2020/10/21 Python
Python实现一个论文下载器的过程
2021/01/18 Python
python中spy++的使用超详细教程
2021/01/29 Python
数以千计的折扣工业产品:ESE Direct
2018/05/20 全球购物
联想新西兰官方网站:Lenovo New Zealand
2018/10/30 全球购物
Foot Locker加拿大官网:美国知名运动产品零售商
2019/07/21 全球购物
TALLY WEiJL法国网上商店:服装、时装及配饰
2019/08/31 全球购物
医学毕业生自荐信
2013/10/11 职场文书
协议书范文
2015/01/27 职场文书
2016年大学生党员公开承诺书
2016/03/24 职场文书
Nginx下配置Https证书详细过程
2021/04/01 Servers
图文详解matlab原始处理图像几何变换
2021/07/09 Python