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编写COM组件的步骤
Mar 17 Javascript
js中的referrer返回上一页使用介绍
Sep 26 Javascript
浅析Javascript使用include/require
Nov 13 Javascript
jtable列中自定义button示例代码
Nov 21 Javascript
javascript 通用loading动画效果实例代码
Jan 14 Javascript
Bootstrap每天必学之按钮
Nov 26 Javascript
JavaScript用200行代码制作打飞机小游戏实例
Jun 21 Javascript
如何利用@angular/cli V6.0直接开发PWA应用详解
May 06 Javascript
vue-vuex中使用commit提交mutation来修改state的方法详解
Sep 16 Javascript
微信小程序左右滚动公告栏效果代码实例
Sep 16 Javascript
vue设置一开始进入的页面教程
Oct 28 Javascript
vant 中van-list的用法说明
Nov 11 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实现用户认证及管理完全源码
2007/03/11 PHP
PHP把JPEG图片转换成Progressive JPEG的方法
2014/06/30 PHP
微信支付PHP SDK之微信公众号支付代码详解
2015/12/09 PHP
基于JQUERY的两个ListBox子项互相调整的实现代码
2011/05/07 Javascript
sliderToggle在写jquery的计时器setTimeouter中不生效
2014/05/26 Javascript
javascript实现多栏闭合展开式广告位菜单效果实例
2015/08/05 Javascript
jQuery实现淡入淡出二级下拉导航菜单的方法
2015/08/28 Javascript
JS+CSS实现简易的滑动门效果代码
2015/09/24 Javascript
基于javascript实现漂亮的页面过渡动画效果附源码下载
2015/10/26 Javascript
基于JS实现类似支付宝支付密码输入框
2016/09/02 Javascript
webpack external模块的具体使用
2018/03/10 Javascript
AngularJS使用$http配置对象方式与服务端交互方法
2018/08/13 Javascript
使用Angular 6创建各种动画效果的方法
2018/10/10 Javascript
vue 移动端适配方案详解
2018/11/15 Javascript
vue和better-scroll实现列表左右联动效果详解
2019/04/29 Javascript
JavaScript实现简单的弹窗效果
2020/05/19 Javascript
Element Rate 评分的使用方法
2020/07/27 Javascript
移动端JS实现拖拽两种方法解析
2020/10/12 Javascript
Python实现求最大公约数及判断素数的方法
2015/05/26 Python
Python利用Beautiful Soup模块搜索内容详解
2017/03/29 Python
轻松理解Python 中的 descriptor
2017/09/15 Python
python实现对csv文件的列的内容读取
2018/07/04 Python
通过python将大量文件按修改时间分类的方法
2018/10/17 Python
pytorch中的自定义数据处理详解
2020/01/06 Python
Python networkx包的实现
2020/02/14 Python
Python Pillow(PIL)库的用法详解
2020/09/19 Python
使用Python实现音频双通道分离
2020/12/25 Python
35款精致的 CSS3 和 HTML5 网页模板 推荐
2012/08/03 HTML / CSS
爱游人:Travelliker
2017/09/05 全球购物
C语言中break与continue的区别
2012/07/12 面试题
电气工程及其自动化学生实习自我鉴定
2013/09/19 职场文书
入职担保书怎么写
2014/05/12 职场文书
工程造价专业求职信
2014/07/17 职场文书
公务员群众路线专题民主生活会发言材料
2014/09/17 职场文书
2014院党委领导班子及其成员群众路线对照检查材料思想汇报
2014/10/04 职场文书
Java各种比较对象的方式的对比总结
2021/06/20 Java/Android