`
zhouyrt
  • 浏览: 1188772 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Firefox/Opera不支持onselectstart事件

 
阅读更多

如下

 

<!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

 

CSS3 定义了“user-select”属性，如下

 

 

可惜所有浏览器都未实现，如FF4/Safar5/Chrome11/Opera10/IE10。

 

相关：

https://developer.mozilla.org/en/CSS/-moz-user-select

http://msdn.microsoft.com/en-us/library/ms536969%28VS.85%29.aspx 

http://www.w3.org/TR/2000/WD-css3-userint-20000216#user-select 

 

  • 大小: 10 KB
0
顶
2
踩
分享到：
| IE6/7/8/9不支持exec的简写方式
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    解决Firefox/Opera 不支持onselectstart事件实现不允许用户select

    在开发中，很多区域是不允许用户select的，在IE/Safari/...Firefox/Opera不支持onselectstart事件&lt;/title&gt; &lt;/head&gt; &lt;body&gt; ”noselect”&gt;Text&lt;/div&gt; [removed] var div = document.getElementBy

    常用代码大全

    - **`onbeforecopy="return false"`**：阻止复制操作（Firefox/Chrome）。 - **`onmouseup="document.selection.empty()"`**：鼠标释放时清空选择。 #### 阻止图片被保存 为了防止图片被直接下载或保存，可以设置`...

    通过脚本控制指定内容不能被选择

    - 对于Firefox浏览器，通过设置`MozUserSelect`属性为`none`来禁止选择。 - 对于其他浏览器（如Opera），通过设置`onmousedown`事件为返回`false`的函数，并设置光标样式为`default`。 2. **示例用法**： - 在`...

    Jquery图片裁剪插件

    4. 兼容性好：适用于各种主流浏览器，包括IE6+、Firefox、Chrome、Safari和Opera。 5. 事件触发：提供如onSelectStart、onSelectChange和onSelectEnd等事件，方便开发者在裁剪过程中执行额外的操作。 三、使用...

    jquery.imgareaselect-0.9.2几种封装

    jQuery.imgAreaSelect兼容大部分现代浏览器，包括Firefox、Chrome、Safari、Opera以及Internet Explorer 6+。在移动设备上，如果支持触控，也可以通过触摸手势进行操作。 总之，jQuery.imgAreaSelect-0.9.2提供了...

    css小技巧汇总

    /* Firefox */ } ``` 8. object标签不显示问题 当使用object标签时，可能会遇到标签不显示的情况，可以通过设置高度为0或字体大小为0的外层div来解决： ```html ;"&gt; &lt;object width="0" height="0"&gt;&lt;/object&gt; &lt;/...

    通过CSS禁用页面内容选中和复制操作

    `-moz-` 前缀是为Firefox浏览器设计的，`-ms-` 前缀是为旧版的Internet Explorer浏览器设计的，`-o-` 前缀是针对旧版的Opera浏览器。而没有前缀的 `user-select` 则是标准的属性，适用于最新标准的浏览器。 将这些...

Magicbox
Global site tag (gtag.js) - Google Analytics