javascript - 如何限制jQuery事件的执行范围？

$(document).ready(function() {
        var $left = $('#scroll-left');
        var $right = $('#scroll-right');
        var position = $('#article_body').css('left');
        if (position <= '-450px') {
            $left.click(function() {
                $('#article_body').animate({
                    left: '+=450px'
                }, '1000');
            });
        } else if (position >= '-4500px') {
            $right.click(function() {
                $('#article_body').animate({
                    left: '-=450px'
                }, '1000');
            });
        }

 });

我通过在包含div上设置CSS left属性来制作一个水平滚动页面。我要它仅在0px和-4500px之间移动。因此，如果我单击左键并位于0px处，它将仅向右移动；或者如果它位于-4500px并单击右键，则它将仅向左移动。

谢谢

最佳答案

您需要在处理程序内部进行检查，如下所示：

$(document).ready(function() {
  $('#scroll-left').click(function() {
    if ($('#article_body').css('left') <= '-450px') {
      $('#article_body').animate({ left: '+=450px' }, '1000');
    }
  });
  $('#scroll-right').click(function() {
    if ($('#article_body').css('left') >= '-4500px') {
      $('#article_body').animate({ left: '-=450px' }, '1000');
    }
  });
});

当前，您正在检查DOM加载时的位置，而不是单击按钮时的位置。相反，您需要做相反的操作，并检查单击按钮的时间...如上所述。如果沿您要检查的方向滚动太远（if检查失败），则单击将无效。

关于javascript - 如何限制jQuery事件的执行范围？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/4362548/