我有一个包含li元素的简单无序列表。我想做一些类似于rc-swipeout npm库的事情,如果你在列表元素上滑动,你会看到选项。
不幸的是,我正在运行Meteor/Blaze应用程序,无法使用React。我发现了几个简单的jQuery库,比如swipeTo,这里有一个演示(适用于移动)。
swipeTo库实际上提供了一些滑动功能,它提供了当你滑动过去时的选项。
但是,我想添加功能,当我刷所有方式,列表项删除。现在,当你一路滑动时,列表项就会反弹回它的正常位置,就像你在演示中看到的那样。
添加这样一个条件的最佳方法是什么?
尝试检查event.clientX
;保存swipeStart中的值并将其与SwipeEnd中的值进行比较。(我不明白swipeto.js脚本是如何使事件坐标可用的,所以我对其进行了编辑,第40和93行):
if(typeof swipeStart == 'function') {
swipeStart.call(this, start); //add 'start' as parameter
}
if(typeof swipeEnd== 'function') {
swipeEnd.call(this, absMoveStatus, e.changedTouches[0].clientX); //add amount moved and clientX as parameter
}
在主脚本中:
$(function() {
$('.item-swipe').swipeTo({
minSwipe: 100,
angle: 10,
binder: true,
swipeStart: function(start) { //now use start value
console.log('start', start);
},
swipeMove: function(e) {
console.log('move');
},
swipeEnd: function(movedAmount, end) {
console.log('end', movedAmount, end);
// if movedAmount value > 200, and end value < 20 (close to left side),
// then delete the item
},
});
deleteItem();
})