手機長按彈出刪除的功能,已實現
<input id="hidJudge" type="hidden" value="0" />
<input id="chb" type="hidden" />
<input id="chb_check" type="hidden" />
<!--隱藏的刪除彈框 start-->
<div class="deleteDiv">
<div class="deleteDiv_tip">您確認要刪除嗎?</div>
<div class="deleteDiv_info">
<span id="" class="deleteDiv_info_left">
<input id="btnCancel" type="button" value="取 消" class="btn-red radius" />
</span>
<span id="" class="deleteDiv_info_right">
<input id="btnDelete" type="button" value="刪 除" class="btn-green radius" />
<input id="btnDelTrue" type="button" value="確 認" class="btn-green radius hide" />
</span>
</div>
</div>
<!--隱藏的刪除彈框 end-->
<script type="text/javascript">
$(document).ready(function () {
$.ajax({
type: "get",
url: "meeting.txt",
//data: { action: "fadetail", userid: userid, routeinfoid: routeinfoid },
dataType: "json",
success: function (BillObj) {
//遍歷
$.each(BillObj.huiYi, function (index, item) {
$("#meeting_Div").append("<ul class=\"processrow\"><li><a href=\"" + item.href + "\"><div class=\"pc-line\"><span class=\"left\">" + item.title + "</span><span class=\"right\">" + item.time + "</span></div><div class=\"pc-line orange\">"
+ item.info + "</div><div class=\"chb\" id=\"chb_" + index + "\"></div></a></li></ul>");
});
//去掉最後一行下劃線
$('#meeting_Div .processrow:last li').css('border-bottom', 'none');
//新增touch事件 start
$('.chb').each(function () {
var len = $('.chb').length;
$('#chb').val(len);
});
$('#meeting_Div .processrow').each(function () {
var timeout;
var n = "";
//滑鼠按下 或 手指觸控式螢幕幕時觸發
$(this).bind('touchstart', function (event) {
event.preventDefault();
$(this).addClass('bghover');
timeout = setTimeout(function () {
event.preventDefault();
$('#btnDelete').show(); $('#btnDelTrue').hide(); $('.deleteDiv_tip').hide();
$('#hidJudge').val("1");
if ($('#hidJudge').val() == "1") {
$('.chb').show();
}
}, 800);//時間變成400ms如果太大,點選太快的時候系統跟不上.所有的問題都出現在這裡
});
//滑鼠鬆開 或 手指從螢幕上離開時觸發
$(this).bind('touchend', function () {
var getChb_ID = $(this).children('li').children('a').children('.chb').attr('id');//獲取圓形按鈕id
var gethref = $(this).children('li').children('a').attr('href');//獲取href連結
if ($('#hidJudge').val() == "1") {
$('.deleteDiv').show(); $('#newDiv').hide();
$('#' + getChb_ID).toggleClass('chb_checked');//切換選中
var n = $('.chb_checked').length;
$('#chb_check').val(n);
if (n == $('#chb').val()) {
$('#selectDiv').hide(); $('#quanBuXuan').show();
} else {
$('#selectDiv').show(); $('#quanBuXuan').hide(); $('#btnDelete').removeClass('disabled');
}
if (n == "0") {
$('#btnDelete').addClass('disabled');
}
}
else if ($('#hidJudge').val() == "0" && $(".deleteDiv").is(":hidden")) {
event.preventDefault();
window.location.href = gethref;//頁面跳轉
}
$(this).removeClass('bghover');
clearTimeout(timeout);//要記得清空時間函式timeout;
});
});
//新增touch事件 end
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
//操作程式碼 start
//全選 按鈕
$('#selectDiv').click(function () {
$('.chb').addClass('chb_checked'); $('#btnDelete').removeClass('disabled');
$('#selectDiv').hide(); $('#quanBuXuan').show();
});
//全不選按鈕
$('#quanBuXuan').click(function () {
$('.chb').removeClass('chb_checked'); $('#btnDelete').addClass('disabled');
$('#quanBuXuan').hide(); $('#selectDiv').show();
});
//取消 按鈕
$('#btnCancel').click(function () {
$('.deleteDiv').hide(); $('#hidJudge').val("0"); $('#chb_check').val("0"); $('.chb').removeClass('chb_checked').hide();
$('#selectDiv').hide(); $('#quanBuXuan').hide(); $('#newDiv').show(); $('#hidJudge').val('0'); //底部層、全選、圓形按鈕隱藏,新建出現
clearTimeout(timeout);
});
//刪除 按鈕
$('#btnDelete').click(function (event) {
if ($(this).hasClass('disabled')) { event.preventDefault(); event.stopPropagation(); }
else {
$('.deleteDiv_tip').show(); $('#btnDelTrue').show(); $('#btnDelete').hide();
}
});
//確認 按鈕
$('#btnDelTrue').click(function () {
//在這裡加上刪除程式碼
var len = $('.chb').length;
var n = $('.chb_checked').length;
if (n == len) {
$('.chb').each(function () {
var geturlID = $(this).parent().attr('href');
geturlID = geturlID.substring(geturlID.lastIndexOf('id=') + 3);//擷取href連結中的id
alert(geturlID);
$(this).parent().parent().parent().remove();//隱藏,假刪除
});
$('.chb').removeClass('chb_checked').hide();
$('#newDiv').show(); $('.deleteDiv').hide(); $('#hidJudge').val('0'); $('.xuan').hide();//確認刪除後,然後關掉彈出層
}
else {
$('.chb').each(function () {
if ($(this).hasClass('chb_checked')) {
var geturlID = $(this).parent().attr('href');
geturlID = geturlID.substring(geturlID.lastIndexOf('id=') + 3);//擷取href連結中的id
alert(geturlID);
$(this).removeClass('chb_checked').hide();
$(this).parent().parent().parent().remove();//隱藏,假刪除
}
});
$('.deleteDiv_tip').hide(); $('#btnDelTrue').hide(); $('#btnDelete').show();
}
clearTimeout(timeout);
});
//操作程式碼 end
});
</script>