刷卡事件處理

Question

我編碼刷卡刪除功能。它在第一個事件上工作正常，但是如果我滑動兩次......它似乎不能正常工作。

我不知道爲什麼如果我向左滑動兩次，「刪除」按鈕會消失。

請參閱下面我的代碼：

<div id="showlist"> 
<div id="btn_del">Delete</div> 
</div> 

<style> 
#showlist { 
width:100%; 
height:100px; 
background:#DDD; 
border-bottom:1px dashed #666; 
} 

#btn_del { 
float:right; 
margin-right:-60px; 
background:red; 
padding:5px; 
display:none;margin; 
border:1px solid #FFF; 
margin-top:20px; 
color:#FFF; 
font:12px Arial; 
font-wieght:bold; 
border-radius:5px; 
} 
</style> 

<script> 
$('#showlist').bind({ 
swipeleft: function() {  
$("#showlist").animate({'width': '90%'}, 300); 
    $("#btn_del").fadeIn(); 

}, 
swiperight: function() {  
$("#btn_del").hide(); 
$("#showlist").animate({'width': '100%'}, 300); 
}, 
preventDefaultEvents: true 
}); 

演示： http://jsfiddle.net/Chae/uLwJg/2/

任何幫助將是非常讚賞。

蔡首爾

Answer 1

我只是解決自己的問題。 我把刪除按鈕對象的可見性的檢查代碼。

$('#showlist').bind({ 

swipeleft: function() { 
    chk = $("#btn_del").is(':visible'); 
    if (!chk) { 
    $("#showlist").animate({'width': '90%'}, 300); 
    $("#btn_del").fadeIn(); 
    } 
}, 

swiperight: function() {  
    $("#btn_del").hide(); 
    $("#showlist").animate({'width': '100%'}, 300); 
}, 

preventDefaultEvents: true 
});