禁止鼠标多次点击选中div中的文字
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Firefox/Opera不支持onselectstart事件</title>
</head>
<body>
<div id="d1" style="width:200px;height:200px;background:gold;">
Text Text
</div>
<script type="text/javascript">
var div = document.getElementById('d1');
div.onselectstart = function() {
console.log(3);
}
</script>
</body>
</html>
当用鼠标去选定div内的文本时,IE/Safari/Chrome 的控制台输出了3,Firefox/Opera则没有输出。
1 IE可以使用onselectstart事件来阻止用户选定元素内文本,如下
<div onselectstart="return false">accc</div>2 Firefox中可以使用CSS "-moz-user-select:none"属性来禁止文本选定
3 webkit浏览器可以使用“-khtml-user-select”,当然也可以使用方式1
可惜所有浏览器都未实现,如FF4/Safar5/Chrome11/Opera10/IE10。
这是通过CSS样式来实现的禁止用鼠标选择功能:unselectable为IE准备,onselectstart为Chrome、Safari准备,-moz-user-select是FF的
css style:html,body{-moz-user-select: none; -khtml-user-select: none; user-select: none;}
<div unselectable="on" onselectstart="return false;" style="-moz-user-select:none;">
屏蔽选择的样式定义:-moz-user-select属性(只支持ff)。
属性有三个属性值:
1、 none:用none,子元素所有的文字都不能选择,包括input输入框中的文字也不能选择。
2、 -moz-all:子元素所有的文字都可以被选择,但是input输入框中的文字不可以被选择。
3、 -moz-none:子元素所有的文字都不能选择,但是input输入框中的文字除外。
禁止鼠标多次点击选中div中的文字的更多相关文章
- 自动选中div中的文字
<html> <head> <title></title> <script type="text/javascript" de ...
- [Flex] 组件Tree系列 —— 阻止用户点击选中Tree中分支节点
mxml: <?xml version="1.0" encoding="utf-8"?> <!--功能描述:阻止用户点击选中Tree中分支节点 ...
- [Flex] 组件Tree系列 —— 阻止用户点击选中Tree中任何节点
mxml: <?xml version="1.0" encoding="utf-8"?> <!--功能描述:阻止用户点击选中Tree中任何节点 ...
- 在div中设置文字与内部div垂直居中
要实现如图一所示的结果: html代码如下: <!DOCTYPE html> <html> <head lang="zh"> <meta ...
- 实现全屏轮播,并且轮播div中的文字盒子一直自动垂直居中
效果如下: 直接上代码了: 说明:轮播图基于swiper.js,自行下载.css在最后 <!DOCTYPE html> <html lang="en"> & ...
- div中单行文字垂直水平居中
1.div中单行文字垂直水平居中.条件:外层div高度已经给定.代码如下: 复制代码代码如下: <style type="text/css">.div3{border: ...
- 实现单选框点击label标记中的文字也能选中
实例: <label for="man"> <input type="radio" value="男" name=&quo ...
- div中让文字垂直居中
在div中如何让文字垂直居中? 作者在刚接触web前端开发时就遇到了这个问题,一直没有记录下来,今天正好有空,便记录下来. 为了方便展示,我把style先直接写在了div里. 效果如下图所示: 图1. ...
- JavaScript设置div中的文字滚动起来 实现滚动效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- 领域驱动设计(Domain Driven Design)参考架构详解
摘要 本文将介绍领域驱动设计(Domain Driven Design)的官方参考架构,该架构分成了Interfaces.Applications和Domain三层以及包含各类基础设施的Infrast ...
- 各大Oj平台介绍[转]
1.题库与网站资源题库-在线提交系统(Online Judge)简介 下面是几个比较大的在线提交系统(OnlineJudge)里面有大量历年的竞赛题目,注册一个ID,然后用自己熟悉的语言(一般有P ...
- 关于.NET的配置文件
无论是exe文件还是dll文件,都可以添加App.config文件,里面设置配置信息.比如<appSettings></appSettings>之间,可以加入Key-Value ...
- C++ 利用socket实现TCP,UDP网络通讯
学习孙鑫老师的vc++深入浅出,有一段时间了,第一次接触socket说实话有点儿看不懂,第一次基本上是看他说一句我写一句完成的,第二次在看SOCKET多少有点儿感觉了,接下来我把利用SOCKET完成T ...
- LA 4975
回文串的题,求最大的双重回文串: 重新复习了一下manacher算法: 代码: #include<cstdio> #include<cstring> #include<a ...
- 【HDU2825】Wireless Password (AC自动机+状压DP)
Wireless Password Time Limit: 1000MS Memory Limit: 32768KB 64bit IO Format: %I64d & %I64u De ...
- 定制ckeditor的菜单
修改配置文件config.js来定制cheditor的菜单,需要以下步骤: 1.找到ckeditor安装目录的config.js文件 2.记下要使用的功能名,以下的"-"代表分隔符 ...
- Android开源项目发现--- 工具类Log篇(持续更新)
1.Catlog 手机端log查看工具,支持不同颜色显示.关键字过滤.级别过滤.进程id过滤.录制功能等 项目地址:https://github.com/nolanlawson/Catlog 在线演示 ...
- Git 、CVS、SVN比较
Git .CVS.SVN比较 项目源代码的版本管理工具中,比较常用的主要有:CVS.SVN.Git 和 Mercurial (其中,关于SVN,请参见我先前的博客:SVN常用命令 和 SVN服务器配 ...
- poj2954
水题,先用叉积求三角形面积然后求三边上的点(由公约数上点)a然后用pick定理S=a+b/2-1就可以求出内部的点数了 var x,y,xx,yy,a1,a2,a3,x1,x2,x3,y1,y2,y3 ...