JS清除选择内容的方法


Posted in Javascript onJanuary 29, 2015

本文实例讲述了JS清除选择内容的方法。分享给大家供大家参考。具体分析如下:

今天在做一个DIV拖动的效果,发现在拖动的时候会选中页面中的文本,于是找了一下JS清除选择的内容的相关信息。

在得到的结果中发现: 在谷歌、火狐、Opera浏览器中,window对象有getSelection属性,而在IE中没有。IE中的document对象有selection属性,因此清除页面中选择的内容也就可以得到解决。

在谷歌、火狐、Opera浏览器中我们可以很容易的通过 window.getSelection().removeAllRanges() 清除选中的内容,在IE中我们可以通过 document.selection.empty() 来清除选中的内容。

于是我们可以这样写:

var clearSlct= "getSelection" in window ? function(){
 window.getSelection().removeAllRanges();
} : function(){
 document.selection.empty();
};

"getSelection" in window 用于判断window对象中是否含有getSelection属性,如果为true则说明当前浏览器支持getSelection,也即浏览器为非IE浏览器,反之亦然。

如果我们想要禁止用户选中页面中的内容,我们可以这样做:

//防止鼠标选中内容(当鼠标松开时清除选中内容)
window.onmouseup=function(){
 clearSlct();
}
   
//防止通过键盘选中内容(当按键松开时清除选中内容)
window.onkeyup=function(){
 clearSlct();
}
 
//使用jQuery的方法
$(window).on("mouseup keyup",function(){
 clearSlct();
});

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

Javascript 相关文章推荐
jQuery Lightbox 图片展示插件使用说明
Apr 25 Javascript
UpdatePanel和Jquery冲突的解决方法
Apr 01 Javascript
jquery移动点击的项目到列表最顶端的方法
Jun 24 Javascript
javascript 中的 delete及delete运算符
Nov 15 Javascript
jQuery-1.9.1源码分析系列(十一)DOM操作续之克隆节点
Dec 01 Javascript
Bootstrap 源代码分析(未完待续)
Aug 17 Javascript
Node.js中process模块常用的属性和方法
Dec 13 Javascript
Jquery EasyUI Datagrid右键菜单实现方法
Dec 30 Javascript
Javascript ES6中数据类型Symbol的使用详解
May 02 Javascript
详解webpack4升级指南以及从webpack3.x迁移
Jun 12 Javascript
微信小程序模拟cookie的实现
Jun 20 Javascript
使用D3.js构建实时图形的示例代码
Aug 28 Javascript
IE中鼠标经过option触发mouseout的解决方法
Jan 29 #Javascript
JS判断是否360安全浏览器极速内核的方法
Jan 29 #Javascript
jQuery中$.each使用详解
Jan 29 #Javascript
jQuery显示和隐藏 常用的状态判断方法
Jan 29 #Javascript
移动设备web开发首选框架:zeptojs介绍
Jan 29 #Javascript
JSON格式的键盘编码对照表
Jan 29 #Javascript
js的window.showModalDialog及window.open用法实例分析
Jan 29 #Javascript
You might like
通过对服务器端特性的配置加强php的安全
2006/10/09 PHP
YII框架中使用memcache的方法详解
2017/08/02 PHP
PHP实现的只保留字符串首尾字符功能示例【隐藏部分字符串】
2019/03/11 PHP
Jquery 获取表单text,areatext,radio,checkbox,select值的代码
2009/11/12 Javascript
JavaScript调试工具汇总
2014/12/23 Javascript
JavaScript运动减速效果实例分析
2015/08/04 Javascript
JavaScript实现的简单烟花特效代码
2015/10/20 Javascript
浅谈JavaScript的计时器对象
2016/12/26 Javascript
nodejs 实现钉钉ISV接入的加密解密方法
2017/01/16 NodeJs
JavaScript实现短暂提示框功能
2018/04/04 Javascript
Vue.js中关于侦听器(watch)的高级用法示例
2018/05/02 Javascript
Angular4.x Event (DOM事件和自定义事件详解)
2018/10/09 Javascript
NVM安装nodejs的方法实用步骤
2019/01/16 NodeJs
微信小程序实现富文本图片宽度自适应的方法
2019/01/20 Javascript
vue轮播组件实现$children和$parent 附带好用的gif录制工具
2019/09/26 Javascript
解决vue cli使用typescript后打包巨慢的问题
2019/09/30 Javascript
python3使用urllib示例取googletranslate(谷歌翻译)
2014/01/23 Python
利用Python的Django框架中的ORM建立查询API
2015/04/20 Python
在Python的Flask框架中构建Web表单的教程
2016/06/04 Python
Python调用微信公众平台接口操作示例
2017/07/08 Python
python3+PyQt5重新实现自定义数据拖放处理
2018/04/19 Python
Python实现的基于优先等级分配糖果问题算法示例
2018/04/25 Python
Python 中的lambda函数介绍
2018/10/10 Python
对pandas里的loc并列条件索引的实例讲解
2018/11/15 Python
Python爬虫beautifulsoup4常用的解析方法总结
2019/02/25 Python
简单的Python调度器Schedule详解
2019/08/30 Python
win10子系统python开发环境准备及kenlm和nltk的使用教程
2019/10/14 Python
Django User 模块之 AbstractUser 扩展详解
2020/03/11 Python
采购文员岗位职责
2013/11/20 职场文书
大学四年个人自我小结
2014/03/05 职场文书
聚美优品恶搞广告词
2014/03/14 职场文书
依法行政工作汇报
2014/10/28 职场文书
部门2014年度工作总结
2014/11/12 职场文书
家长评语怎么写
2014/12/30 职场文书
个人工作能力自我评价
2015/03/05 职场文书
自主招生英文自荐信
2015/03/25 职场文书