引入hammer.js, 创建新的对象，。阻止默认的事件
2tap.js解决快速点击的问题
<script src="tap.js"></script>
<div id="container">
<button id="button-1">Click event</button>
<button id="button-2">Tap event</button>
</div>
<div id="output"></div>
<script>
var container = document.getElementById('container')
var button1 = document.getElementById('button-1');
var button2 = document.getElementById('button-2');
var output = document.getElementById('output');
var tap = new Tap(container);
button1.addEventListener('click', callback, false);
button2.addEventListener('tap', callback, false);
function callback (e) {
e.preventDefault();
var p = document.createElement('p');
p.textContent = 'event: ' + e.type;
output.insertBefore(p, output.firstChild);
}
</script>
3333: fastclick.js解决快速点击的问题
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style>
*
{
margin: 0;
}
body
{
}
.button
{
background-color: #3d3d3d;
border: 0px;
height: 80px;
width: 80%;
font-size: 50px;
margin: 10% 0% 0% 10%;
color: #fff;
}
.fu
{
min-height: 100%;
min-width: 100%;
background-color: Black;
background: rgba(0,0,0,0.4);
position: absolute;
top: 0;
text-align: center;
display: none;
}
.ts
{
margin: 8% auto;
width: 400px;
height: 400px;
top: 59%;
background-color: #fff;
text-align: center;
}
</style>
<script src="fastclick.js" type="text/javascript"></script>
<script src="jquery-1.7.2.js" type="text/javascript"></script>
<script type="application/javascript">
window.addEventListener('load', function () {
FastClick.attach(document.body);
}, false);
function xian() {
$(".fu").show().hide(350);
}
</script>
</head>
<body>
<div>
<div class="but">
<input class="button" type="button" value="点击我" onclick="xian()" /></div>
<div class="fu" >
<div class="ts">
我是浮层
</div>
</div>
</div>
</body>
</html>
