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 相关文章推荐
用jquery来定位
Feb 20 Javascript
jQuery常用数据处理方法小结
Feb 20 Javascript
JavaScript操作select元素和option的实例代码
Jan 29 Javascript
详解JS正则replace的使用方法
Mar 06 Javascript
JavaScript原生数组Array常用方法
Apr 06 Javascript
详解vue-router 2.0 常用基础知识点之router-link
May 10 Javascript
Angularjs的$http异步删除数据详解及实例
Jul 27 Javascript
vue3.0 CLI - 2.6 - 组件的复用入门教程
Sep 14 Javascript
vue实现滑动到底部加载更多效果
Oct 27 Javascript
vue 关闭浏览器窗口的时候,清空localStorage的数据示例
Nov 06 Javascript
JS中的变量作用域(console版)
Jul 18 Javascript
基于vue实现微博三方登录流程解析
Nov 04 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与SQL注入攻击[三]
2007/04/17 PHP
php学习 函数 课件
2008/06/15 PHP
array_multisort实现PHP多维数组排序示例讲解
2011/01/04 PHP
PHP设计模式之工厂方法设计模式实例分析
2018/04/25 PHP
javascript编程起步(第五课)
2007/01/10 Javascript
javascript中比较字符串是否相等的方法
2013/07/23 Javascript
文本框文本自动补全效果示例分享
2014/01/19 Javascript
javascript判断chrome浏览器的方法
2014/03/26 Javascript
js+css实现导航效果实例
2015/02/10 Javascript
使用javascript将时间转换成今天,昨天,前天等格式
2015/06/25 Javascript
jquery验证手机号是否正确实例讲解
2015/11/17 Javascript
原生js实现图片层叠轮播切换效果
2016/02/02 Javascript
在JavaScript中模拟类(class)及类的继承关系
2016/05/20 Javascript
简单介绍react redux的中间件的使用
2018/04/06 Javascript
JavaScript实现创建自定义对象的常用方式总结
2018/07/09 Javascript
jquery 动态遍历select 赋值的实例
2018/09/12 jQuery
vue-cli中vue本地实现跨域调试接口
2019/01/16 Javascript
微信小程序云开发使用方法新手初体验
2019/05/16 Javascript
JavaScript判断浏览器运行环境的详细方法
2019/06/30 Javascript
js实现打字小游戏
2019/12/17 Javascript
[07:52]2014DOTA2 TI逗比武士游V社解说背后的故事
2014/07/10 DOTA
Python生成随机密码
2015/03/10 Python
Python爬虫之xlml解析库(全面了解)
2017/08/08 Python
python3基于OpenCV实现证件照背景替换
2018/07/18 Python
对Python 除法负数取商的取整方式详解
2018/12/12 Python
python自动化实现登录获取图片验证码功能
2019/11/20 Python
香蕉共和国Banana Republic官网:美国GAP旗下偏贵族风格服饰品牌
2016/11/21 全球购物
Clarks鞋法国官方网站:英国其乐鞋品牌
2018/02/11 全球购物
LivingSocial爱尔兰:爱尔兰本地优惠
2018/08/10 全球购物
电子商务专业推荐信范文
2013/12/02 职场文书
检查机关党的群众路线个人整改措施
2014/10/04 职场文书
2015关于重阳节的演讲稿
2015/03/20 职场文书
公司出纳岗位职责
2015/03/31 职场文书
MySQL 亿级数据导入导出及迁移笔记
2021/06/18 MySQL
vue如何使用模拟的json数据查看效果
2022/03/31 Vue.js
Python使用pandas导入csv文件内容的示例代码
2022/12/24 Python