移动端click时间延迟300
解决移动端click延迟事件方法，，引入fastclick.js 然后在script标签里面写上FastClick.attach(document.body);
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>众筹影集</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0">
<link rel="stylesheet" type="text/css" href="css/reset.css">
<link rel="stylesheet" type="text/css" href="css/zhongchou.css">
</head>
<body>
<figure><img src="img/L--E--S--L--I--E.png"></figure>
<figure class="odd"><img src="img/pic_word.png"></figure>
<figure><img src="img/pic.png"></figure>
<figure class="odd"><img src="img/pic_slogan1.png"></figure>
<article>
<p>为纪念哥哥六十岁，由部分陕西荣迷牵头，聚合江西、北京、浙江、海南、加拿大等地荣迷力量，从数千张哥哥图片中精选出150张左右，集结成册，以飨荣迷。<br><br>
《见得张国荣》从设计、选图、文案到编辑，全部由荣迷担任。其中有相当数量的罕见图片，少量图片首次付印。<br><br>
《见得张国荣》共计60页，高240mm，宽190mm，封面用130克白色细布纹特种纸，裱2.5mm纸板；标题文字部分烫银，激凸；内页用157克日本原浆进口特种纸，四色印刷，专色印刷。整册模切机压圆角处理。<br><br>
本影集定价139元，不公开发售，专供荣迷，千册起印。如不足千册，所筹款项全部退回参与者。如众筹达千册，则最终印数视实际情况决定。
</p>
<ul id="list">
<li> • 推荐他人参与本次众筹有返现奖励；凭付款人在众筹页面提供的推荐者微信号，在众筹结束后，向推荐人每本返现10元，上不封顶。</li><br>
<li> • 推荐或购买《见得张国荣》60册及以上数量者，可在本书尾页印上自己想对哥哥说的话，不超过60字。</li>
</ul>
<p>张国荣60周年众筹影集QQ群：398306287<br>本次众筹影集活动截止日期为 2016/03/31</p>
</article>
<figure class="odd"><img src="img/pic_slogan2.png"></figure>
<form>
<h4>姓名</h4>
<input type="text" name="user" value="" id="user" placeholder="请填写你的姓名">
<h4>手机号</h4>
<input type="text" name="number" value="" id="number" placeholder="请填写你的手机号，保证填写无误">
<h4>收货地址</h4>
<input type="text" name="address" value="" id="address" placeholder="请准确填写你的地址，方便我们快递给你">
<h4>推荐人微信号</h4>
<input type="text" name="weixin" value="" id="weixin" placeholder="填写本次众筹推荐人微信号，为推荐人返还10元">
</form>
<h4>想对哥哥说的话</h4>
<textarea placeholder="写下你想对哥哥说的话。推荐或购买60册及以上者,你的思念会出现在影集尾页..." id="TextArea1">
</textarea>
<div id="limit"><span id="textCount">60</span>字</div>
<article id="shopping">
<h4>购买数量</h4>
<div class="clearfix">
<span id="left"><img src="img/number_cancel.png"></span>
<span id="mid-span">1</span>
<span id="right"><img src="img/number_add.png"></span>
</div>
</article>
<article id="money"class="clearfix">
<div class="clearfix">
<span>需支付：</span>
<span id="rmb">131.4</span>
</div>
<div id="goumai">立即支付</div>
</article>
<script src="js/jquery-2.1.4.min.js"></script>
<script src="js/jquery.touch.js" ></script>
<script src="js/click.js"></script>
<script>
$(document).ready(
function(){
FastClick.attach(document.body);
var $shu =1;
$("#right").on("click",function(){
$shu++;
var a=$shu*131.4;
var b= a.toFixed(2)
$("#mid-span").html($shu);
$("#rmb").html(b);
})
$("#left").on("click",function(){
if($shu==1){
$("#mid-span").html("1");
$("#rmb").html("131.4");
}
else{
$shu--;
a=$shu*131.4;
b= a.toFixed(2)
$("#mid-span").html($shu);
$("#rmb").html(b);
}
})
/*字数减少*/
$("#TextArea1").on("keyup",function(){
var curLength=$("#TextArea1").val().length;
if(curLength>60)
{
var num=$("#TextArea1").val().substr(0,60);
$("#TextArea1").val(num);
alert("超过字数限制！" );
}
else
{
$("#textCount").text(60-$("#TextArea1").val().length);
}
})
/*手机号验证*/
$("#number").on("blur",function(){
var telphone = $("#number").val();
var myreg = /^1[34578]\d{9}$/;
if(!telphone==""){
if(!myreg.test(telphone)){
alert("请输入正确的手机号！")
$(this).val("");
$(this).focus();
}
}
});
}
)
</script>
</body>
</html>
移动端click时间延迟300的更多相关文章
- vue.js 添加 fastclick的支持 处理移动端click事件300毫秒延迟
fastclick:处理移动端click事件300毫秒延迟. 1,先执行安装fastclick的命令 npm install fastclick 2,在main.js中引入,并绑定到body. imp ...
- fastclick：处理移动端click事件300毫秒延迟
fastclick:处理移动端click事件300毫秒延迟 1.兼容性 iOS 3及更高版本的移动Safari iOS 5及更高版本的Chrome Android上的Chrome(ICS) Opera ...
- h5开发app,移动端 click 事件响应缓慢的解决方案
造成点击缓慢的原因 从点击屏幕上的元素到触发元素的 click 事件,移动浏览器会有大约 300 毫秒的等待时间.为什么这么设计呢? 因为它想看看你是不是要进行双击(double tap)操作. 使用 ...
- 移动端click事件延迟300ms到底是怎么回事，该如何解决？
不管在移动端还是PC端,我们都需要处理用户点击,这个最常用的事件.但在touch端click事件响应速度会比较慢,在较老的手机设备上会更为明显(300ms的延迟). 问题由来 这要追溯至 2007 年 ...
- 移动端click事件300ms延迟
移动端click 事件延迟300ms 一般情况下,如果没有经过特殊处理,移动端浏览器在派发点击事件的时候,通常会出现300ms左右的延迟.也就是说,当我们点击页面的时候移动端浏览器并不是立即作出反应, ...
- 移动端click点透bug
移动端click点透bug click点透bug有一个特定的产生情况: 当上层元素是tap事件,且tap后消失,下层元素是click事件.这个时候,tap上层元素的时候就会触发下层元素的click事件 ...
- 移动端click事件延迟300ms的原因以及解决办法
这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为大屏幕设备所设计的.于是苹果的工程师们做了一些约定,应对 iPhone 这种小屏幕浏览桌面端站点 ...
- 移动端click事件延迟300ms的原因以及解决办法[转载]
原文:http://www.bubuko.com/infodetail-822565.html 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为 ...
- 移动端click时间、touch事件、tap事件
一.click 和 tap 比较 两者都会在点击时触发,但是在手机WEB端,click会有 200~300 ms,所以请用tap代替click作为点击事件. singleTap和doubleTap 分 ...
随机推荐
- Js 日期 多少分钟前，多少秒前
;(function(window){ /** * [dateDiff 算时间差] * @param {[type=Number]} hisTime [历史时间戳,必传] * @param {[typ ...
- quertz 使用小例
最近工作中用了个任务调度,学的不好,就把它记下来,为了以后参考 一般的 quartz都允许有一个名为quartz.properties的配置文件,通过它可以修改quartz框架运行时的环境: Quar ...
- Linux更改计算机名称
1.修改:vim /etc/hosts 2.修改:vim /etc/sysconfig/network 3.重启:reboot 如不重启可以输入:hostname 新改的计算机名称,然后su
- mysql 有报错 ERROR! MySQL is not running, but lock file (/var/lock/subsys/mysql) exists
sh-4.1# /etc/init.d/mysqld status ERROR! MySQL is not running, but lock file (/var/lock/subsys/mysql ...
- Java面试常见知识点总结(一)
1.sleep()和wait(): Java中的多线程是一种抢占式的机制,而不是分时机制.抢占式的机制是有多个线程处于可运行状态,但是只有一个线程在运行. ● 共同点: (1) 他们都是在多 ...
- 【Java EE 学习 75 上】【数据采集系统第七天】【二进制运算实现权限管理】【权限分析和设计】
一.权限计算相关分析 1.如何存储权限 首先说一下权限保存的问题,一个系统中最多有多少权限呢?一个大的系统中可能有成百上千个权限需要管理.怎么保存这么多的权限?首先,我们使用一个数字中的一位保存一种权 ...
- java Clone 的心得记录
我看有些类并没有实现Cloneable接口,这种情况下调用clone()方法也不try catch也不throws: 但是如果我自己这样搞,也不实现Cloneable,接口,直接调用clone()方法 ...
- 组合模式/composite模式/对象结构型模式
组合模式/composite模式/对象结构型 意图 将对象组合成树形结构以表示"整体--部分"的层次结构.Composite使得用户对单个对象和组合对象的使用具有一致性. 动机 C ...
- 【刷题记录】首师附NOIP练习20160820
[由于老师不让发题目,So只能发考点喽!!!!噜噜噜] [题目(嘘~~~~~)]:百度云下载 [T1]:好像是DP,路径压缩+排序+分情况处理100分(噜噜噜) [T2]:正解好难的样子,DFS乱搞了 ...
- 矩阵快速幂 HDU 4565 So Easy!（简单？才怪！）
题目链接 题意: 思路: 直接拿别人的图,自己写太麻烦了~ 然后就可以用矩阵快速幂套模板求递推式啦~ 另外: 这题想不到或者不会矩阵快速幂,根本没法做,还是2013年长沙邀请赛水题,也是2008年Go ...