配列に特定の文字列が含まれているかどうかを確認してから、その項目を選択してください

Question

これは非常に曖昧に聞こえるかもしれませんが、私はできる限り説明しようとします。

画像があり、そのソースは.attr('src')機能で収集されました。この画像は5つの画像のうちの1つで、すべて同じdivにあります。これまで私は2つのものを収集しました：

1. var src、私がクリックした画像のURLを含んでいます。
2. 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：その場合index - 1に-1だろうとelementYouWantはundefinedになりますのでindexは、ゼロの場合

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

var elementYouWant = array[index - 1] 

あなたがチェックを追加することができます。

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 2

に同じコード：

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

あなたがここに確認することができます。https://jsfiddle.net/xeq4yn0z/

Answer 3

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

Answer 4

あなたは以下試してみてください：すべての画像が同じ親<div>要素に配置されている、あなたが指定した要素の直前の兄弟にアクセスするためにjQueryの.prev()を使用することができると仮定すると、array.length