jquery - 如何使用 jquery 移动到下一个图像？

Question

我在移动到下一个图像时遇到问题。就像我们在 FB 中移动到下一个图像一样。我尝试过但无法实现。rightimage 是右箭头的类

$('.rightimage').on("click", function (event) {

    var sectionId = $(this).parents('ul').attr('id'); // i get the current image
    var outputId = sectionId.replace('ul', 'img'); // i get the current image id
    var NextId = outputId + 2; //increment and assign it to another var

    if ($('NextId').length) { // see if the image with id exists    

        // here i have to put the image if it exists else i have to check or the next image
    }
    if ($('NextId+1' > rightImgcounter)) {

        // disable the button
    }
}); 

'rightImgcounter' 是全局 javascript 变量，它为我们的右图像提供序列号。图像是动态生成的。不知道如何在屏幕上向右移动下一个图像。如果右边没有图像，则禁用该按钮。

Answer 1

看看这是否有帮助：

// Using the jQuery version 1.7+
$('.rightimage').on("click", function (event) {

    var sectionId = $(this).parents('ul').attr('id');
    var outputId = sectionId.replace('ul', 'img');

    //var NextId = outputId + 2;    
    var NextId = outputId.replace(/(\d+)+/g, function (_, number) {
        return parseInt(number) + 2;
    });

    // Check the NextId in the console (for debugging purpose) 
    console.log(NextId);

    // see if the image with id exists 
    if ($('#' + NextId).length) {
        // here i have to put the image if it exists 

    }

    var counter = parseInt(/(\d+)/.exec(NextId)[0], 10) + 1;
    if (counter > rightImgcounter) {

        // disable the button
        $(this).prop('disabled', true);
    }
});