更改Javascript數組索引

我有一個漫遊網站，它可以遍歷數據庫中的所有圖像，並將它們顯示爲縮略圖。用戶可以點擊其中的一個圖像，在viewComic.php模板上以正常大小查看它。更改Javascript數組索引

我想讓用戶按左右箭頭導航圖像。

所以，我的想法是：

pagination.php通過數據庫結果數組循環處理的正確頁面（通過補償）圖像顯示。用戶可以點擊結果（如下）轉到viewcomic.php模板上的特定圖像。
```
'<br />IMG: <a href="./templates/viewcomic.php?id=' . $row['imgid'] . '&image=' . $imgpath.$row['imgname'] . '"> 
```

現在就viewcomic.php，我得到並顯示圖像

$imgid = $_GET['id']; 
$imgpath = $_GET['image']; 
<center><img src=".<?php echo $imgpath ?>" /></center>

用戶可按下左，右箭頭在圖像瀏覽...

問題1：Javascript是否允許您手動設置數組中的索引位置？

因爲我想允許用戶得到一個和最後一個圖像，我希望他們能夠從他們目前（在一個他們pagination.php點擊），而不是從的開頭的圖像開始圖像陣列。我沿着URL中的$ imgid傳遞，因此我將設置javascript img數組索引== $ imgid，這將允許用戶繼續滾動瀏覽圖像。

問題2：我該如何保持當前索引的數組？

當我想去某個方向時，它工作正常。但如果我想改變方向，我必須按兩次鍵。我發現這是因爲索引在（imgIndex ++）之後遞增，我按下了鍵。意思是，當它開始以相反的方式時，它首先需要遞減以將索引返回到當前圖像，然後再次按下鍵以最終顯示下一個圖像。我不知道如何解決這個問題。使用++ imgIndex也有問題，因爲它會跳過一個圖像。

<?php 
getImages() { 
//DB connection code omitted 
    $img = array(); 
    while($row = $catResult->fetch_assoc()) { 
     $img[] = "'../images/all_comics/" . $row['imgname'] . "'"; 
} 
return $img; 
?> 

var imgArray = [<?php echo implode(',', getImages()) ?>]; 
$(document).ready(function() { 
    var img = document.getElementById("theImage"); 
    img.src = imgArray[0]; 
    var imgIndex = 0; 

    $(document).keydown(function (e) 
    { 
     //next image 
     if (e.which == 39) 
     { 
      if (imgIndex == imgArray.length) 
      { 
       imgIndex = 0; 
      } 
      img.src = imgArray[imgIndex++]; 
        //now the index is ahead by 1, which is bad if you want to press <-- to get the last image because the index is ahead by 1. 
     } 

     //last image 
     if (e.which == 37) 
     { 
      if (imgIndex == 0) 
      { 
       imgIndex = imgArray.length; 
      } 
      img.src = imgArray[--imgIndex]; 
     } 
    }); 
});

任何想法？

非常感謝！

來源

2012-10-15 Growler

目前尚不清楚imgArray是如何在你的JavaScript初始化。我想索引必須從0運行到[數組大小 - 1]。如果是這樣，有一個簡單的方法來調整索引：'if（e.which == 39）imgIndex ++; else if（e.which == 37）imgIndex--; imgIndex =（imgIndex + imgArray.length）％imgArray.length;'。我不確定這是關於您的實際問題，所以我發佈評論而不是答案。 – Stan

@我的壞，哈哈。我用代碼更新了問題。 – Growler

那麼，什麼時候出現問題？您可以根據用於'viewcomic.php'調用的'imgid'（類似於'var imgIndex = <？php echo $ imgid;？>;'），僅從php開始編寫初始imgIndex值。至於在瀏覽器中調整索引，我已經在上面提到過了。 – Stan

更改操作順序：

if (e.which == 39) { 
    imgIndex++;    
    if (imgIndex>imgArray.length) { 
     imgIndex = 0; 
    } 
    img.src = imgArray[imgIndex];     
}

來源

2012-10-15 20:26:13

洛爾感謝的人。我嘗試了幾種不同的方式，但一直存在問題 - '褒貶不一。你碰巧知道什麼關於在Javascript中手動設置數組的索引位置？ – Growler

數組沒有本機「索引位置」。你只需使用一個變量指向你想要的任何位置。 –

對不起，我知道..我最初試圖設置：var imgIndex = <？php echo $ imgid？>;但在javascript內使用php時遇到問題......剛纔發現我沒有迴應它 - 哎呀：/無論如何，感謝您的幫助。現在一切正常。 – Growler

更改Javascript數組索引

回答

相關問題