【问题标题】:disable keyCode for 1st and last element禁用第一个和最后一个元素的 keyCode
【发布时间】:2012-11-21 23:15:48
【问题描述】:

我制作了一个 onkeydown 函数,它可以水平运行 li 元素块,它运行完美,但我需要当第一个和最后一个 li 块处于焦点时,左右键应该被禁用。

谁能提出正确的方法?提前谢谢!!!

$(document).ready(function() {
    var winht = $(window).height();
    var contUl = $('.content ul').children('li').size();
    var widLi = $('.content ul li').width();
    var contUlAndLI = contUl * widLi;
    var leftIndex = $('.content ul').css('left','0');
    $('.content ul').width(contUlAndLI);
    $('#frame').height(winht);

$("body").keydown(function(e) {

  if(e.keyCode == 37) { // left
    $(".content ul").animate({
      left: "-=980"
    });
  }
  else if(e.keyCode == 39) { // right
    $(".content ul").animate({
      left: "+=980"
    });
  }

});

if( leftIndex == 0){

    $("body").keydown(function(e) {

        if(e.keyCode == 39){ // right
            //event.preventDefault();
            return false;
            }

        });
  }

});

工作参考是jsfiddle

【问题讨论】:

    标签: jquery jquery-plugins jquery-selectors


    【解决方案1】:

    我通过使用一个计数器来做到这一点,每次用户按左或右时都会检查其值。计数器就是ul 标签内li 元素的数量。

    var ulCount = $('.content li').length - 1;
    var i = 0;
    

    只有在计数器的值范围内才运行动画:

    if(e.keyCode == 37) { // left
        if (i < ulCount) {
            i++;
            $(".content ul").animate({
              left: "-=980"
            });
        }
    }
    else if(e.keyCode == 39) { // right
        if (i > 0) {
            i--;
            $(".content ul").animate({
                left: "+=980"
            });
        }
    }
    

    我也更新了jsFiddle

    【讨论】:

    • 滑动区域是980 修复可以是动态的吗?我的意思是窗口宽度大小?
    猜你喜欢
    • 2016-02-22
    • 2012-06-11
    • 1970-01-01
    • 2015-08-31
    • 1970-01-01
    • 2014-12-19
    • 1970-01-01
    • 1970-01-01
    • 2013-01-14
    相关资源
    最近更新 更多