如何切片字符串對象並在jQuery中返回新值？

所以基本上我有一個jQuery中的畫廊腳本。當用戶點擊縮略圖時，圖像屬性src然後被傳送到主圖庫img元素。不過，我現在希望用戶能夠單擊下一個/上一個按鈕並遍歷文件夾中的所有圖像。我將它們全部命名爲img0.jpg，img1.jpg等等。我想我可以簡單地通過「attr（）」和「slice（）」獲得當前的img src，然後通過變量增加img'0'，img'1'等中的數字。繼承人我的代碼。我希望你們能理解！如何切片字符串對象並在jQuery中返回新值？

$("#next").click(function() { 
    var i = 0; 
    var sliceImg = $("#gallerycover").attr("src").slice('0', String.length - 5); 
    $("#gallerycover").attr("src", sliceImg + i++ +."jpg"); 
});

<div id="gallerycontainer"> 
    <img id="gallery" src="" /> 
</div> 

<div id="thumbcontainer"> 
    <div id="box4"><img class="thumb" src="" /></div> 
</div>

來源

2013-04-04 johnnyzoo

嘗試更換你的下面的代碼：

var sliceImg = $("#gallerycover").attr("src").slice('0', String.length - 5); 
$("#gallerycover").attr("src", sliceImg + i++ +."jpg");

這一個：

var src = $("#gallerycover").attr("src"); 
var idx = src.indexOf('img'); 
var sliceImg = src.slice(idx+3, src.length - 4); 
$("#gallerycover").attr("src", (parseInt(sliceImg, 10) + 1) + ".jpg");

見working demo

來源

2013-04-04 21:42:00 Nelson

每個圖像文件夾集的目錄是相當大的，例如，「images/gallery/environments/gameprops/img0.jpg」這會影響你遊戲的代碼嗎？ – johnnyzoo 2013-04-04 22:13:11

基於該路徑模式，代碼應該可以工作，但最好知道的是嘗試一下！ :-) – Nelson 2013-04-04 22:16:03

你能解釋一下parseInt行嗎？是的，當然，如果它有效，我會贊成！ – johnnyzoo 2013-04-04 22:21:59

您可以使用正則表達式分割圖像源字符串，也可以通過向縮略圖添加屬性來更好地跟蹤單個幻燈片，以便您的下一個/上一個函數可以檢查和增加而無需解析字符串（其中將來可能會改變）。

來源

2013-04-04 21:42:09 Derek

var myInt = 0; 
var myInt++; 

var sliceImg = $("#gallerycover").attr("src").replace(/\d+/, myInt); 

$("#gallerycover").attr("src", sliceImg);

來源

2013-04-04 21:44:18

如何切片字符串對象並在jQuery中返回新值？

回答

相關問題