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 相关文章推荐
JqGrid web打印实现代码
May 31 Javascript
JS链式调用的实现方法
Mar 07 Javascript
Extjs4 Treegrid 使用心得分享(经验篇)
Jul 01 Javascript
自定义的一个简单时尚js下拉选择框
Nov 20 Javascript
javascript原始值和对象引用实例分析
Apr 25 Javascript
jQuery插件制作之参数用法实例分析
Jun 01 Javascript
jQuery插件 Jqplot图表实例
Jun 18 Javascript
原生JS实现轮播效果+学前端的感受(防止走火入魔)
Aug 21 Javascript
jQuery插件ImgAreaSelect实现头像上传预览和裁剪功能实例讲解一
May 26 jQuery
webpack 3.X学习之多页面打包的方法
Sep 04 Javascript
开发Node CLI构建微信小程序脚手架的示例
Mar 27 Javascript
如何使用JavaScript策略模式校验表单
Apr 29 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图片缩放实现方法
2014/02/20 PHP
php中get_defined_constants函数用法实例分析
2015/05/12 PHP
PHP自动补全表单的两种方法
2017/03/06 PHP
PHP实现的简单组词算法示例
2018/04/10 PHP
JavaScript触发器详解
2007/03/10 Javascript
Javascript this 的一些学习总结
2012/08/31 Javascript
如何将php数组或者对象传递给javascript
2014/03/20 Javascript
JavaScript实现自动消除按钮功能的方法
2015/08/05 Javascript
javascript手风琴下拉菜单实现代码
2015/11/12 Javascript
微信js-sdk分享功能接口常用逻辑封装示例
2016/10/13 Javascript
yarn与npm的命令行小结
2016/10/20 Javascript
微信小程序 textarea 详解及简单使用方法
2016/12/05 Javascript
bootstrapValidator表单验证插件学习
2016/12/30 Javascript
vue.js实现点击后动态添加class及删除同级class的实现代码
2018/04/04 Javascript
在小程序中集成redux/immutable/thunk第三方库的方法
2018/08/12 Javascript
Angularjs实现数组随机排序的方法
2018/10/02 Javascript
JS实现滑动插件
2020/01/15 Javascript
把大数据数字口语化(python与js)两种实现
2013/02/21 Python
深入理解Javascript中的this关键字
2015/03/27 Python
Python中使用第三方库xlutils来追加写入Excel文件示例
2015/04/05 Python
Python简单实现Base64编码和解码的方法
2017/04/29 Python
浅谈python import引入不同路径下的模块
2017/07/11 Python
django实现用户登陆功能详解
2017/12/11 Python
pyqt5利用pyqtDesigner实现登录界面
2019/03/28 Python
解决Python二维数组赋值问题
2019/11/28 Python
用python制作个视频下载器
2021/02/01 Python
HTML5 Web存储方式的localStorage和sessionStorage进行数据本地存储案例应用
2012/12/09 HTML / CSS
台湾团购、宅配和优惠券:17Life
2017/08/14 全球购物
Diesel美国网上商店:意大利牛仔时装品牌
2020/12/10 全球购物
给护士表扬信
2014/01/19 职场文书
旅游市场营销方案
2014/03/09 职场文书
奠基仪式策划方案
2014/05/15 职场文书
2014最新离职证明范本
2014/09/12 职场文书
财务工作失职检讨书
2014/11/21 职场文书
美术教师个人总结
2015/02/06 职场文书
毕业生自荐信范文
2015/03/05 职场文书