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 相关文章推荐
asp 取文本框名称代码
Dec 02 Javascript
一个很简单的jquery+xml+ajax的无刷新树结构(无css,后台是c#)
Jun 02 Javascript
Jquery CheckBox全选方法代码附js checkbox全选反选代码
Jun 09 Javascript
jquery 元素相对定位代码
Oct 15 Javascript
Firefox中autocomplete=&quot;off&quot; 设置不起作用Bug的解决方法
Mar 25 Javascript
js弹出层之1:JQuery.Boxy (二)
Oct 06 Javascript
js 判断计算字符串长度/判断空的简单方法
Aug 05 Javascript
JavaScript声明变量时为什么要加var关键字
Sep 29 Javascript
详解JavaScript中setSeconds()方法的使用
Jun 11 Javascript
javascript运动详解
Jul 06 Javascript
JS实现旋转木马式图片轮播效果
Jan 18 Javascript
详解从零搭建 vue2 vue-router2 webpack3 工程
Nov 22 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一些有意思的小区别
2006/12/06 PHP
PHP中array_keys和array_unique函数源码的分析
2016/02/26 PHP
深入剖析PHP中printf()函数格式化使用
2016/05/23 PHP
PHP5.4起内置web服务器使用方法
2016/08/09 PHP
php脚本守护进程原理与实现方法详解
2017/07/20 PHP
PHP实现基于栈的后缀表达式求值功能
2017/11/10 PHP
一款Jquery 分页插件的改造方法(服务器端分页)
2011/07/11 Javascript
cnblogs 代码高亮显示后的代码复制问题解决实现代码
2011/12/14 Javascript
Yii-自定义删除确认弹框(zyd)jquery实现代码
2013/03/04 Javascript
javascript中数组的concat()方法使用介绍
2013/12/18 Javascript
javascript简单性能问题及学习笔记
2014/02/04 Javascript
jQuery.lazyload+masonry改良图片瀑布流代码
2014/06/20 Javascript
浅析js预加载/延迟加载
2014/09/25 Javascript
jquery插件orbit.js实现图片折叠轮换特效
2015/04/14 Javascript
基于jQuery实现的扇形定时器附源码下载
2015/10/20 Javascript
js+canvas绘制五角星的方法
2016/01/28 Javascript
基于zepto.js简单实现上传图片
2016/06/21 Javascript
vue.js学习笔记之绑定style样式和class列表
2016/10/31 Javascript
AngularJS控制器之间的通信方式详解
2016/11/03 Javascript
前端主流框架vue学习笔记第二篇
2017/07/26 Javascript
JavaScript实现的数字与字符串转换功能示例
2017/08/23 Javascript
Vue结合Video.js播放m3u8视频流的方法示例
2018/05/04 Javascript
Vue.directive 实现元素scroll逻辑复用
2019/11/29 Javascript
Python CVXOPT模块安装及使用解析
2019/08/01 Python
Python使用百度api做人脸对比的方法
2019/08/28 Python
python实现logistic分类算法代码
2020/02/28 Python
python deque模块简单使用代码实例
2020/03/12 Python
纯CSS3实现滚动的齿轮动画效果
2014/06/05 HTML / CSS
新西兰领先的内衣店:Bendon Lingerie新西兰
2018/07/11 全球购物
业务员岗位职责
2013/11/16 职场文书
校园之星获奖感言
2014/01/29 职场文书
《长城和运河》教学反思
2014/04/14 职场文书
应聘教师求职信
2014/07/19 职场文书
奉献家乡演讲稿
2014/09/13 职场文书
2016三八妇女节校园广播稿
2015/12/17 职场文书
护士岗前培训心得体会
2016/01/08 职场文书