Jquery 禁用按钮

我需要帮助禁用幻灯片中的两个按钮（右/左），当它们达到各自的边界-；将背景颜色和光标类型更改为默认值就足够了。 这是jQuery代码：

var menuItem_place = 0;
var menuItem_position = 0;
var menuItem_limit = parseInt($('.menuItem').length) - 1;

$('.menuItem:first .content').css({margin: 0, height: '100%', lineHeight: '99px'})

$('#rightBtn').on('click', function(){
    if (menuItem_place < menuItem_limit) {
        menuItem_place++;
    }
    menu_animate();
});

$('#leftBtn').on('click', function(){
    if (menuItem_place > 0){
        menuItem_place--;
    }
    menu_animate();
});

var menuitems = $('.menuItem');
var contents = $('.content', menuitems);

menuitems.click(function(){
    menuItem_place = $(this).index();
    menu_animate()
});

function menu_animate() {
    contents.animate({margin: 20, height: '64%', lineHeight: '63px'}, 300);
    $(contents.get(menuItem_place)).stop().animate({margin: 0, height: '100%', lineHeight: '99px'}, 100)
    menuItem_position = 0 - (menuItem_place * 200);
    $('#menuContainer').stop().animate({left: menuItem_position + 'px'}, 300);
}

var menuItem\u place=0；
变量菜单项位置=0；
var menuItem_limit=parseInt（$（'.menuItem'）.length）-1；
$（'.menuItem:first.content'）.css（{margin:0，height:'100%'，lineHeight:'99px'}）
$（'#rightbn'）。在（'click'，function（）上{
如果（菜单项位置<菜单项限制）{
menuItem_place++；
}
菜单_动画（）；
});
$（'#leftBtn'）。在（'click'，function（）上{
如果（菜单项位置>0）{
menuItem_place——；
}
菜单_动画（）；
});
var menuitems=$（'.menuItem'）；
变量内容=$（'.content'，菜单项）；
菜单项。单击（函数（）{
menuItem_place=$（this.index（）；
菜单_动画（）
});
功能菜单_animate（）{
动画（{margin:20，height:'64%'，lineHeight:'63px'}，300）；
$（contents.get（menuItem_place））.stop（）.animate（{margin:0，height:'100%'，lineHeight:'99px'}，100）
菜单项位置=0-（菜单项位置*200）；
$（'#menuContainer'）.stop（）.animate（{left:menuItem_position+'px'}，300）；
}

代码不是我的，它超出了我的能力去做我需要的事情。任何帮助都将不胜感激。 塔克斯

---

佩德罗

我不确定你所说的禁用两个按钮是什么意思，但我只能假设你指的是左键和右键

我已经更新了你的JSFIDLE代码，请看下面

我所做的只是告诉他们在css中显示：none

或

---

您可以将它们一起从HTML中删除。

只需检查

menuItem\u place

以查看它是零（第一个元素）还是等于

$（'.menuItem'）。长度-1

（最后一个元素）。我创建了一个类（

.disabled

），该类根据这些条件应用或删除

var menuItem_place = 0;
var menuItem_position = 0;
var menuItem_limit = parseInt($('.menuItem').length) - 1;
if (menuItem_place == 0) $('#leftBtn').addClass('disabled'); // <-- NEW
$('.menuItem:first .content').css({
    margin: 0,
    height: '100%',
    lineHeight: '99px'
})

$('#rightBtn').on('click', function () {
    if (menuItem_place < menuItem_limit) {
        menuItem_place++;
    }
    menu_animate();
});

$('#leftBtn').on('click', function () {
    if (menuItem_place > 0) {
        menuItem_place--;
    }
    menu_animate();
});

var menuitems = $('.menuItem');
var contents = $('.content', menuitems);

menuitems.click(function () {
    menuItem_place = $(this).index();
    menu_animate()
});

function menu_animate() {
    contents.animate({
        margin: 20,
        height: '64%',
        lineHeight: '63px'
    }, 300);
    $(contents.get(menuItem_place)).stop().animate({
        margin: 0,
        height: '100%',
        lineHeight: '99px'
    }, 100)
    menuItem_position = 0 - (menuItem_place * 200);
    $('#menuContainer').stop().animate({
        left: menuItem_position + 'px'
    }, 300);
    $('#rightBtn,#leftBtn').removeClass('disabled'); // <-- NEW
    if ($('.menuItem').length - 1 == menuItem_place) $('#rightBtn').addClass('disabled'); // <-- NEW
    if (menuItem_place == 0) $('#leftBtn').addClass('disabled');  // <-- NEW
}

var menuItem\u place=0；
变量菜单项位置=0；
var menuItem_limit=parseInt（$（'.menuItem'）.length）-1；
if（menuItem_place==0）$（'leftBtn'）.addClass（'disabled'）；//0) {
menuItem_place——；
}
菜单_动画（）；
});
var menuitems=$（'.menuItem'）；
变量内容=$（'.content'，菜单项）；
菜单项。单击（函数（）{
menuItem_place=$（this.index（）；
菜单_动画（）
});
功能菜单_animate（）{
内容。动画({
差额：20，
身高：64%，
线宽：“63px”
}, 300);
$（contents.get（menuItem\u place））.stop（）.animate({
保证金：0，
高度：“100%”，
线宽：“99px”
}, 100)
菜单项位置=0-（菜单项位置*200）；
$（“#menuContainer”）.stop（）.animate({
左：菜单项位置+‘px’
}, 300);
$（“#rightbn，#leftBtn”）.removeClass（'disabled'）；//当滑块一直向左时，您可能希望禁用按钮1和左按钮，而当滑块一直向右时，则希望禁用按钮4和右按钮？如果是，为什么不这样说呢？在任何情况下，仅仅发布一些（含糊不清的）都有点粗鲁我不明白这个问题的背景。你想什么时候禁用？是的，当幻灯片满足左/右限制时，按钮将被禁用。很抱歉模糊。感谢你的快速响应。我以前有点模糊。我的意思是禁用左/右按钮在幻灯片到达左/右结尾后，他们自己。哦，对了，这让事情变得更清楚了。你可能想用它更新你的原始帖子。我还认为@j08691回答了你的问题，他提供了这个链接，它工作得非常好。但是我正在做的项目我不能使用css类/禁用，因为我正在做所有的事情通过jQuery使用动画按钮（mouseenter/mouseleave/click）进行修改，修改后会返回意外的结果。我基本上为我的代码替换了addClass（），但效果不好。这里有一个更新，如果你对所有按钮进行注释/*NEW*/你会看到按钮的。很抱歉造成混乱。：s