js或css指定元素点击时内容不可被选中
一、css3中可以使用"user-select"属性:
body{
-webkit-user-select:none;/*谷歌 /Chrome*/
-moz-user-select:none; /*火狐/Firefox*/
-ms-user-select:none; /*IE 10+*/
user-select:none;
}
user-select:auto:默认,可以选中; none:不可选;text:只可选文本;all:父级;
二、js实现:
document.onselectstart = function(){return false;}
document.onselectstart = null ;
jquery 实现:
$("body").hover(function(){
document.onselectstart = function(){return false;},
},
function(){
document.onselectstar=text;
}
});
注意:
2、Firefox/Opera不支持onselectstart事件Firefox中可以使用CSS "-moz-user-select:none"属性来禁止文本选定
3、webkit浏览器可以使用“-khtml-user-select”,当然也可以使用onselectstart事件来阻止用户选定元素内文本,如下
<div onselectstart="return false">accc</div>
onselect
onselect是在文本框(input、textarea)内的文本被选中时所触发的事件,其触发时间是在文本被选择以后(即文本已经被选择,已经
显式的表现出来)。该事件只被input和textarea标签支持。
js或css指定元素点击时内容不可被选中的更多相关文章
- CSS 解决z-index上层元素遮挡下层元素点击事件问题
解决z-index上层元素遮挡下层元素点击事件问题 by:授客 QQ:1033553122 开发环境 Win 10 element-ui "2.8.2" Vue 2.9.6 需求 ...
- (网页)angular中实现li或者某个元素点击变色的两种方法(转)
转自脚本之家: 本篇文章主要介绍了angular中实现li或者某个元素点击变色的两种方法,非常具有实用价值,需要的朋友可以参考下 本文介绍了angular中实现li或者某个元素点击变色的两种方法,分享 ...
- 【百度统计】设置页面元素点击事件转化pv、uv
html元素点击事件内添加代码:_hmt.push(['_trackEvent', category, action, opt_label, opt_value]); 1. '_trackEvent' ...
- jquery 复选框全选/全不选切换 普通DOM元素点击选中/取消选中切换
1.要选中的复选框设置统一的name 用prop() prop() 方法设置或返回被选元素的属性和值. $("#selectAll").click(function(){ $(&q ...
- JS点击子元素不触发父元素点击事件(js阻止冒泡)
js阻止冒泡 <html> <title></title> <head> <meta charset="utf-8"> ...
- 赋予option元素点击事件后,点击select时却触发了option事件。如何解决?
将select的优先级提到option之前就可以了. 方法:为select元素添加position:relative: <select class="adt" name=&q ...
- 通过js添加的元素点击事件无法触发
var blk_have ='<div class="sw-off"></div>'; $('#blk').prepend(blk_have); $(doc ...
- jQuery移除或禁用html元素点击事件常用方法小结
移除或禁用html元素的点击事件可以通过css实现也可以通过js或jQuery实现. 一.CSS方法 .disabled { pointer-events: none; } 二.jQuery方法 方法 ...
- 从一个ListBox中的元素点击导入另一个ListBox元素中
先看效果图:
随机推荐
- html5+css3+javascript 自定义提示窗口
效果图: 源码: 1.demo.jsp <%@ page contentType="text/html;charset=UTF-8" language="java& ...
- word-wrap与word-break的区别,以及无效情况
两种方法的区别说明: 1,word-break:break-all 例如div宽400px,它的内容就会到400px自动换行,如果该行末端有个英文单词很长(congratulation等),它会把单词 ...
- Java经典逻辑编程50题
Java经典逻辑编程50题 2016-11-03 09:29:28 0个评论 来源:Alias_fa的博客 收藏 我要投稿 [程序1] 題目:古典问题:有一对兔子,从出生后第 ...
- HDU 1754 I Hate It【线段树 单点更新】
题意:给出n个数,每次操作修改它的第s个数,询问给定区间的数的最大值 把前面两道题结合起来就可以了 自己还是敲不出来------------- #include<iostream> #in ...
- vue如何给它的data值赋值
activeDisplay的值如何改变 用$set();方法 vm.$set('b', 2) 或者 Vue.set(data, 'c', 3) this.someObject = Object.ass ...
- sql中对日期的筛选
#几个小时内的数据 DATE_SUB(NOW(), INTERVAL 5 HOUR) #今天 select * from 表名 where to_days(时间字段名) = to_days(now() ...
- React显示文件夹中SVG
import React from 'react'; import _ from 'lodash'; import styles from './iconPicker.less'; const req ...
- OKHttp使用简单介绍
如今android网络方面的第三方库非常多,volley.Retrofit.OKHttp等,各有各自的特点,这边博客就来简介下怎样使用OKHttp. 梗概 OKHttp是一款高效的HTTP客户端,支持 ...
- zoj 1655 单源最短路 改为比例+最长路
http://acm.zju.edu.cn/onlinejudge/showProblem.do? problemId=655 没有理解清题意就硬套模板.所以WA了好几次. 解析看我的还有一篇http ...
- SVN配置以及自己主动部署到apache虚拟文件夹
SVN配置以及自己主动部署到apache虚拟文件夹 一.VisualSVN server 服务端和TortoiseSVNclient下载 VisualSVN下载:http://subversion.a ...