JQuery 移动如何防止 li 项向右滑动

JQuery mobile how to prevent the li item to swipe right?

本文关键字:li 移动 何防止 JQuery      更新时间:2023-09-26

我正在使用我已经修改的代码 https://github.com/ksloan/jquery-mobile-swipe-list 的和平,并且它工作正常。但是,代码有两个按钮,右侧和左侧。在我的项目中,我只有一个在右侧,所以向左滑动以发现它没关系,但我找不到如何消除向右滑动,因为我在左侧没有任何按钮,并且每次滑动时它都会崩溃那个方向。

有什么建议吗?

法典:

  $(function() {
  function prevent_default(e) {
  e.preventDefault();
  }
  function disable_scroll() {
  $(document).on('touchmove','#myPostsList .ui-content', prevent_default);
  }
  function enable_scroll() {
  $(document).unbind('touchmove',' #myPostsList .ui-content', prevent_default);
  }
  var x;
  $(document)
  .on('touchstart', '.swipe-delete li > a', function(e) {
  console.log(e.originalEvent.pageX);      
  ///// GET ID OF SELECTED POST AND STORE IN A DIV FOR AJAX /////
  document.getElementById("myPostIDStorage").value = $(this).attr('data-key');
  $('.swipe-delete li > a.open').css('left', '0px').removeClass('open') ;// close em all
  $(e.currentTarget).addClass('open');
  x = e.originalEvent.targetTouches[0].pageX // anchor point

  })
  .on('touchmove', '.swipe-delete li > a', function(e) {
  var change = e.originalEvent.targetTouches[0].pageX - x;
  change = Math.min(Math.max(-100, change), 100); // restrict to -100px left, 0px right
  e.currentTarget.style.left = change + 'px';
  if (change < -10) disable_scroll() // disable scroll once we hit 10px horizontal slide
  })
  .on('touchend', '.swipe-delete li > a', function(e) {
  var left = parseInt(e.currentTarget.style.left);
  var new_left;
  if (left < -35) {
  new_left = '-100px';
  } /*else if (left > 35) {
     new_left = '100px'
     } */ else {
  new_left = '0px';
  }
  //e.currentTarget.style.left = new_left
  $(e.currentTarget).animate({left: new_left}, 200)
  enable_scroll();
  });

}(;

确保你拥有所有的原始代码

您需要做的就是稍微改变一下数学

它说change = Math.min(Math.max(-100, change), 100);

更改为change = Math.min(Math.max(-100, change), 0)

将 100 更改为 0 表示从左到右移动的像素为 0,因此它不会移动

演示

http://jsfiddle.net/yvjr0zqf/

如果您希望右侧停止反向移动数学,但这次 100 是正数 change = Math.min(Math.max(0, change), 100)