HTML5手机页面里面如何把长按复制避免
在写HTML5手机页面的时候,有时候会写到一些标签是需要用户长按然后放开的
但是微信里面长按就会出现复制,大大影响了用户体验,那么如何可以避免呢?
我也是最近写到这样的页面,总结了一部分,大家可以作为参考

1.有一个按钮,用户需要长按它说话,但是显示在微信里面的网页,长按会出现复制的菜单,造成用户体验不流畅。像下图这样

2.这个按钮我是用a标签写的,在a标签里面加一句代码
ontouchstart = "return false;"
这个方法,安卓和苹果系统都可以用,个人比较喜欢这个,其中return false;可以替换为js函数,直接进行调用

3.上面的方法阻止的是一个按钮区域的长按复制,但是其他地方还有有的,像下图这样

4.那么怎样可以阻止当前页面的微信长按复制
在css样式表里面加入如下代码
*{
-webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
-o-user-select:none;
}
但是这个方法,对安卓系统不适用,苹果系统适用,我都试过

5.如果实在没办法,可以让用户在浏览器中打开,就没有这样长按复制的,可以写个页面告诉用户,点击右上角——浏览器中打开

6.在普通浏览器中是没有这样的问题的,不过我还是喜欢第一种方法

HTML5手机页面里面如何把长按复制避免的更多相关文章
- 禁止手机页面中A标签长按弹出路径框
//禁止手机页面中A标签长按弹出路径框 window.onload=function(){ document.documentElement.style.webkitTouchCa ...
- 安卓手机 HTML5 手机页面 输入表单被键盘遮挡住了
TML5 手机页面 输入表单被键盘遮挡住了 请问 大神 怎么 js 或者 JQ 判断安卓手机软键盘的键盘隐藏键按下去了? 有使用 uexWindow 方法 能判断到确定键 是 13 但是不知道这个键的 ...
- html5手机页面的那些meta
一.普通手机页的设置1.<meta name="viewport" content=""/>说明:屏幕的缩放 content的几个属性: width ...
- 玩转HTML5移动页面
(1) 动画雪碧图涉及的动画十分多,用的元素也十分多,请务必使用雪碧图(Sprite)!网上的工具有一些可以帮助你生成雪碧图的工具,例如CssGaga,GoPng等等,自动化构建工具Grunt和Gul ...
- 玩转HTML5移动页面(优化篇)
原文:http://www.grycheng.com/?p=472 承接上文<玩转HTML5移动页面(动效篇)>,上次说的是让页面动起来的一些小技巧.而页面动起来的根基是功能可用的页面,因 ...
- 玩转HTML5移动页面(动效篇)
原文:http://www.grycheng.com/?p=458 作为一名前端,在拿到设计稿时你有两种选择: 1.快速输出静态页面 2.加上高级大气上档次狂拽炫酷屌炸天的动画让页面动起来 作为一个有 ...
- 玩转HTML5移动页面(优化篇)
标签:h5 页面优化收藏 热门分享 网页设计师必备的 酷站收藏网站 2013年不容错过的app ui素材 40个漂亮的扁平化网页设计欣赏 国内网页设计公司网站欣赏 55套网页设计常用的psd格式UI ...
- 浅谈HTML5单页面架构(一)——requirejs + angular + angular-route
心血来潮,打算结合实际开发的经验,浅谈一下HTML5单页面App或网页的架构. 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又要数单页面架构体验 ...
- HTML5手机APP开发入(5)
HTML5手机APP开发入(5) 回顾一下 HTML5手机APP开发入(4) 如何自定义Component,directive HTML5手机APP开发入(3) 如何实现MVC的代码重构,自定义一个P ...
随机推荐
- 谈谈java多线程(一)
其实很早就想写一些java多线程方面的文章,只是奈何这东西看着简单,但要真要理解和正确使用可能还需要花费一定的精力,虽然平时的工作中会用到这方面的知识,可是更多的只是为了完成工作,至于详细的东西,也没 ...
- 9.Django组件-cookie和session
HTTP协议的无保存状态,对两次请求没有任何关联.每次请求都是相互独立的. 1.cookie简介 什么是会话跟踪技术我们需要先了解一下什么是会话!可以把会话理解为客户端与服务器之间的一次会晤,在一次会 ...
- linux中top命令使用及查看tcp连接
Linux top命令 介绍:top命令是Linux下常用的性能分析工具,能够实时显示系统中各个进程的资源占用状况,Linux top命令用于实时显示 process 的动态,即可以通过用户按键来不断 ...
- P1007 独木桥
P1007 独木桥最少的话是同时朝一个方向,最多可以这样考虑,碰头时不是转向吗?它等价于穿过另一个人,也就是两个人交换,最后取最大值就好了. #include<iostream> usin ...
- P2399 non hates math
P2399 non hates math将分数化成小数的模拟题,把循环减掉就可以了.1.1(234)*10^4==11234.234*10^1==11.2349999*(1.1(234))==1122 ...
- C++泛型线性查找算法——find
C++泛型线性查找算法--find <泛型编程和STL>笔记及思考. 线性查找可能是最为简单的一类查找算法了.他所作用的数据结构为一维线性的空间.这篇文章主要介绍使用 C++ 实现泛型算法 ...
- [环境]vscode中python虚拟环境
在项目.vscode/settings.json下设置 { "python.pythonPath": "/path/to/python2.7"}
- C#全能数据库操作类及调用示例
C#全能数据库操作类及调用示例 using System; using System.Data; using System.Data.Common; using System.Configuratio ...
- AGC 016B.Colorful Hats(思路)
题目链接 对于某个元素分类讨论一下,就可以知道n个元素的总颜色种数了. 比如对a[1]分类讨论: 若1的颜色和某个元素相同,则总颜色数为a[1].a[i]要么等于a[1](i与某个元素颜色相同,记个数 ...
- [POI2011]Rotacje na drzewie (2)/[BZOJ3702]二叉树
[POI2011]Rotacje na drzewie (2) 题目大意: 一棵有\(n\)个叶子结点的二叉树,每个叶子结点有一个权值,恰好是\(1\sim n\)的一个排列,你可以任意交换每一对子结 ...