點擊切換圖像

Question

嗨，我已經完成了工作，但我很感興趣，如果有任何選擇以更好的方式做到這一點，因爲我的解決方案在我看來很原始。

jQuery(document).ready(function($){ 



var montaz = $(".montaz"); 
var doradztwo = $(".doradztwo"); 
var produkcja = ("$.produkcja"); 

montaz.hide(); 
doradztwo.hide(); 

$(".montaz1").on("click", function(){ 
    $(".doradztwo").hide(); 
    $(".produkcja").hide(); 
    $(".montaz").show(); 
}); 


$(".doradztwo1").on("click", function(){ 
    $(".produkcja").hide(); 
    $(".montaz").hide(); 
    $(".doradztwo").show(); 
}); 



$(".produkcja1").on("click", function(){ 
    $(".montaz").hide(); 
    $(".doradztwo").hide(); 
    $(".produkcja").show(); 
}); 

}); 

http://codepen.io/anon/pen/xgaQOy

Answer 1

例如，你可以有這樣的功能：

var images = ['image1', 'image2', 'image3']; 
var currentImage = 0; 
function showNewImage(newImage) 
{ 
    currentImage = newImage; 
    for (var i = 0; i < images.length; i++) 
    { 
     if (i == currentImage) 
     { 
      $(images[i]).show(); 
     } 
     else 
     { 
      $(images[i]).hide(); 
     } 
    } 
} 

然後爲每個圖像做：

$("imageX").on("click", function() {showNewImage(2);}); 

這種方式，你可以有許多圖像，你想要的。