阻止元素被选中

1.IE10+实现方式,css3

.unselect {
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;    

    /* 以下两个属性目前并未支持,写在这里为了减少风险 */
    -o-user-select: none;
    user-select: none;
}

user-select: auto; => 用户可以选中元素中的内容
user-select: none; => 用户不可选中元素中的内容
user-select: text; => 用户可以选中元素中的文字
目前 user-select 兼容 Chrome 6+、Firefox、IE 10+、Opera 15+、Safari 3.1+。

2.IE5.5-9的实现,unselectable

<span unselectable="on"></span>

unselectable属性不具有继承性,如果要设置整个页面,就要遍历所有子元素并为各子元素添加该属性才有效。

3.参考

《JavaScript框架设计》──9.3.2 user-select

难道你以为仅仅这样就可以阻止firefox选中文本了嘛

时间: 2025-01-03 23:38:44

阻止元素被选中的相关文章

JS魔法堂:阻止元素被选中

一.前言 在为IE5.5~9polyfill HTML5新特性placeholder时需要阻止元素被选中,因此在网上.书上查阅相关资料,记录在此以便日后查阅. 二.IE10+实现方式──CSS3 .unselect { -webkit-user-select: none; -moz-user-select: none; -khtml-user-select: none; -ms-user-select: none; /* 以下两个属性目前并未支持,写在这里为了减少风险 */ -o-user-se

Jquery如何阻止元素冒泡同类型事件

今天遇到一个问题,组件中同元素绑定了多个相同的事件a,b,在a事件中有一个回调函数返回一个布尔类型值,如果为真则继续下去,如果假则直接return; 那么我们先来了解一下事件对象中阻止事件的几个方法: 1. event.preventDefault();  -- 阻止元素的默认事件.注:a元素的点击跳转的默认事件 , button,radio等表单元素的默认事件 , div 元素没有默认事件 例: <a href="http://www.baidu.com" target=&qu

jquery 获取一组元素的选中项 - 函数、jquery获取复选框值、jquery获取单选按钮值

做表单提交时,如果现在还在用form提交,用户体验很差,所以一般使用ajax提交. 其中需要获取每个表单输入元素的值,获取的时候像文本框这些还好说,Jquery提供了 .val() 方法,获取很方便,但是获取复选框和单选按钮的值确比较麻烦. 今天闲来无事封装了一个函数,以后获取复选框和单选按钮的值就只需要调用这个函数,传入jquery选择器就可以了,下面附上函数. 函数 /** * 获取单个或一组输入元素的选中项 * 传入Jquery选择器 * 支持:text,返回:文本 * 支持:hidden

事件冒泡。阻止事件冒泡 |阻止元素的默认行为

<.1> 如果在页面中重叠了多个元素,并且重叠的这些元素都绑定了同一个事件,那么就会出 现冒泡问题. 触发的顺序是从小范围到大范围. 这就是所谓的冒泡现象,一层一层往上. <html> <head> <title></title> <script src="jquery-2.1.3.js"></script> <style type="text/css"> div#a {

阻止页面双击选中文本解决方案

在双击左右箭头,快速切换图片滚动时,会选择附近区域的文字,感觉不是很好,今天在同事在分享时,讲到了这个问题, 试了一下,不错,解决了问题IE及Chrome下的方法一样,对相应的元素添加onselectstart=”return false;”但是,这个在火狐下不起作用,但是火狐下可以用css样式来达到这个效果,即添加-moz-user-select:none;就可以兼容ie,google,firefox了,即代码如下所示: 1 <div class="picBox" onsele

CSS阻止页面双击选中文本

http://www.w3cui.com/?p=141 当点击连续点击箭头按钮时会出现蓝色部分.这个问题也是双击选中文本引起的.

js阻止元素事件的冒泡

阻止冒泡: 1 function cancelBubble(e){ 2 if (e.stopPropagation) { 3 e.stopPropagation(); 4 } else { 5 e.cancelBubble = true; 6 } 7 }

zepto获取select元素当前选中option

//jQuery $("#select_city").find("option:selected"); //zepto $("#select_city option").not(function(){ return !this.selected })

jquery实现点击进行跳转后,改点击的元素添加选中的效果

<script type="text/javascript" src="http://www.cnblogs.com/jq.js"></script> .active { color: red; } //html代码 <ul id="tab2"> <li><a href="http://www.cnblogs.com/index.html">首页</a>&