js检测用户长按或选中当前元素上的文字,检测用户复制操作

来源:赵克立 分类: HTML5 标签:js特效发布时间:2016-09-26 10:43:25浏览:288
版权声明:
本文为博主原创文章,转载请声明原文链接...谢谢。o_0。
更新时间:
2016-12-20 20:39:34

移动端检测用户是否复制过一些文字的功能实现.

首先直接检测复制事件似乎是不可能的,因为没有复制这个事件,所以只能检测用户是否选中过或在这些文字上长按过的操作,因为选中或长按后最可能的操作就是复制啦

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>标题</title>
<meta name="keywords" content="关键字" />
<meta name="description" content="描述" />
</head>
<body>
<input id="weixin" type="text" value="http://www.zhaokeli.com/" style="border:none;display:block;background:#ededed;height:30px;line-height:30px;" readonly="readonly" />
<script type="text/javascript">
! function(a, b) {
"user strict";
a.jiance = {
_xy: [0, 0],
init: function(id, callback) {
var obj = document.getElementById(id);
obj.addEventListener('touchstart', function(event) {
if (event.targetTouches.length == 1) { 
//设置如果长按两秒
jiance.timeid = setTimeout(function() {
//准备进行复制........
typeof callback == 'function' && callback(touch, obj);
}, 2000);
event.preventDefault();
var touch = event.targetTouches[0];
jiance._xy[0] = touch.pageX;
jiance._xy[1] = touch.pageY;
}
}, false);
obj.addEventListener('touchmove', function(event) {
if (event.targetTouches.length == 1) {    
clearTimeout(jiance.timeid);
event.preventDefault();
var touch = event.targetTouches[0];
//移动超过10个像素判断为选中文字
if ((Math.abs(touch.pageX - jiance._xy[0])) > 10) {
//准备进行复制........
typeof callback == 'function' && callback(touch, obj);
}
}
}, false);
obj.addEventListener('touchend', function(event) {
clearTimeout(jiance.timeid);
jiance._xy[0] = 0;
jiance._xy[1] = 0;
}, false);
}
}
}(window);
/**
 * 使用方法
 * @param  {[type]} touch [description]
 * @param  {[type]} dom)  { var        val [description]
 * @return {[type]}       [description]
 */
jiance.init('weixin', function(touch, dom) {
var val = dom.value;
dom.setSelectionRange(0, val.length);
dom.focus();
});
</script>
</body>
</html>



微信号:kelicom QQ交流群:215861553
点击更换验证码
留言