检查数组是否包含某个字符串，然后 select 该项目

Question

好吧，这听起来可能很模糊，但我会尽力解释。

我有一张图片，我用 .attr('src') 函数收集了它的来源。此图像是其他 5 张图像之一，都在同一 div 中。到目前为止，我收集了两件事：

var src，其中包含我点击的图像的url。
var 数组，包含 div.

这里是 HTML 结构：

<div class="images">
 <img src="path1" />
 <img src="path2" />
 <img src="path3" />
 <img src="path4" />
 <img src="path5" />
</div>

想象一下，我点击了第三张图片。变量 'src' 将包含值 'path3'。我希望，当我单击页面底部的箭头图标时，该值将切换为 'path2'，数组中的前一项。

我该怎么做？

Answer 1

假设您的变量 src 和 array:

var index = array.findIndex(function(img) {
    return img.src === src
})

var elementYouWant = array[index - 1]

如果 index 为零，您可以添加检查，因为在这种情况下 index - 1 将是 -1，而 elementYouWant 将是 undefined。 array.length

相同

Answer 2

假设您的所有图像都放在同一个父 <div> 元素中，您可以使用 jQuery 的 .prev() 访问指定元素的前一个兄弟元素：

function getPrevSrc (currentSrc) {
    // Get DOM element with the given src attribute
    // could be optimized by providing a parent element
    var $currentImg = $("[src='" + currentSrc + "']");

    // Get previous sibling
    // Note that using this on the first image is an edge case,
    // so you have to handle it accordingly to your needs
    var $prevImg = $currentImg.prev();

    // Return previous src
    return $prevImg.attr("src");
}

Answer 3

var imageArray; //Ur images array;
var index=imageArray.indexOf(src);
if(index>0) {
  src=imageArray[index-1]; 
}

Answer 4

您应该尝试以下代码：

$('img').click(function() {
        alert($(this).attr('src'));
    alert($(this).prev('img').attr('data-value'));
});

您可以在这里查看：https://jsfiddle.net/xeq4yn0z/

检查数组是否包含某个字符串，然后 select 该项目

Check if array contains certain string, then select that item

html

javascript

arrays

jquery

src