span 禁止选中_js 禁止图片被选中

1.双击图片click事件切换过程中发生选中图片的现象

2.双击向右切换按钮click事件过程中发生选中图片的现象

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+。

IE5.5~9的实现──unselectable属性

由于unselectable属性不具有继承性，所以要遍历所有子元素并为各子元素添加该属性才有效。

// 将元素及其后代元素均设置为不可选择

var unselectable = function(root){

root.setAttribute('unselectable', 'on');

var descendant = root.getElementsByTagName("*");

var rTagName = /input|iframe|textarea|select/i;

for (var i = 0, el; el = descendant[i++];){

if (!rTagName.test(el.tagName)){

el.setAttribute('unselectable', 'on');

}

}

};

注意：

1. 若模板中包含标签会造成标签结束符混乱的问题，因此通过该方式存放模板时，不能包含结束标签；

2. xmp元素必须作为body的子孙元素。

由于模板文本中出现