0

我目前正在制作一个图片库，它正在做一些我不太理解的非常奇怪的事情。当我单击我想要的“下一个图像”或“上一个图像”按钮时，该按钮会消失而不是显示下一个/上一个图像。

我已经上传到这里了，试试看

按钮功能如下所示：

var nextbutton= $('.next');
var prevbutton= $('.prev');

nextbutton.click(function(){
    $(this).parent(images).hide(0).next().show(0);
    return false;
});

prevbutton.click(function(){
    $(this).parent(images).hide(0).prev().show(0);
    return false;
});

工作正常，但后来我决定添加另一个功能，让您单击当前正在查看的图像，然后具有与“下一个图像”按钮相同的功能，将您带到下一个图像。很简单，我想，只需复制我用于按钮的“下一张图片”功能，但使用不同的选择器：

var imagebutton= $('#imagecontainer img:not(:last)');

imagebutton.click(function(){
    $(this).parent(images).hide(0).next().show(0);
    return false;
});

它做了应该做的事情，您单击图像并显示下一个图像。但是，现在下一个/上一个按钮在单击时会消失，并且它们不会将您带到下一个/上一个图像。很奇怪！

我在这里忽略了一些明显的东西吗？我对 JQuery 很陌生，所以非常感谢任何帮助！

4

1 回答 1

1

虽然我不确定下一个按钮消失的原因是什么，但请尝试使用以下代码进行绑定：

$(".next, #imagecontainer img:not(:last)").on("click", function(e){
    $(this).closest("div").hide().next().show();
    e.preventDefault();
});

$(".prev").on("click", function(e){
    $(this).closest("div").hide().prev().show();
    e.preventDefault();
});

在控制台中播放您的页面说它可以工作。

于 2012-09-30T17:20:50.450 回答