所以我想从不同的文件夹加载不同的图像。我有一个小谜题,你可以改变格式,例如3x3,3x4,4x3和4x4等等,现在我想要当有人点击“选择格式”并选择3x3时,它会加载来自3x3文件夹的图像,如果有人点击在4x4上我想要4x4文件夹中的图像。
该文件夹类似于/images/3x3/1.png或/images/4x4/1.png。因为现在所有图片都是从同一个文件夹加载的。任何想法如何解决?我尝试制作一个新变量,然后使用if语句从不同的文件夹中选择,但它没有用。
以下是更好理解的代码:
代码: http://jsfiddle.net/Cuttingtheaces/vkyxgwo6/19/
应该更改文件夹的部分,因为它现在只使用images文件夹来获取图像:
function changeFormat(x, y) {
var puzzlepieces = [];
var finalValue = x * y - 2;
for (var i = 0; i <= finalValue; ++i) {
puzzlepieces.push(i);
}
puzzlepieces.push('blank')
createSlidingpuzzle(puzzlepieces, x, y);
}
function createSlidingpuzzle(puzzlepieces, x, y) {
var puzzle = '<div id="slidingpuzzleContainer' + x + 'x' + y + '">';
cols=x;
puzzlepieces=shuffle(puzzlepieces);
for (var puzzleNr = 0; puzzleNr < puzzlepieces.length; ++puzzleNr) {
puzzle += '<img src="images/' + puzzlepieces[puzzleNr] + '.png" class="puzzlepiece" id="position' + puzzlepieces[puzzleNr] + '" alt="' + puzzlepieces[puzzleNr] + '" onclick="shiftPuzzlepieces(this);" width="100" height="100" />';
}
puzzle += '</div>';
showSlidingpuzzle(puzzle);
}
非常感谢提前。
答案 0 :(得分:1)
如果你想要像以下格式的图像网址:&#34; /images/3x3/1.png"比你必须改变这行代码:
puzzle += '<img src="images/' + puzzlepieces[puzzleNr] + '.png" class="puzzlepiece" id="position' + puzzlepieces[puzzleNr] + '" alt="' + puzzlepieces[puzzleNr] + '" onclick="shiftPuzzlepieces(this);" width="100" height="100" />';
到
puzzle += '<img src="images/' + x + 'x' + y + '/' +[puzzleNr] + '.jpg" class="puzzlepiece" id="position' + puzzlepieces[puzzleNr] + '" alt="' + puzzlepieces[puzzleNr] + '" onclick="shiftPuzzlepieces(this);" width="100" height="100" />';
这是一个分支您的版本的工作示例:JsFiddle。如果您检查图像,您可以看到它有这样的来源
src="images/3x3/4.jpg"