從圖像的名稱生成信息

Question

我試圖尋找在網路上一個答案，但找不到任何這樣提前道歉..

比方說，我有一個名爲「設計」與圖片文件夾

design1_main_front.png 
design1_mockup-black.png 
design1_mockup-white.png 

design2_main_front.png 
design2_mockup-black.png 
design2_mockup-yellow.png 
design2_mockup-red.png 

• 我要的是一個與「_front」一個檢索者並將其添加到一個類
• 添加的那些與'_front「到」 IMG樣機'「標籤
• 與添加的那些」到選擇的選項標籤的方式，如果我點擊下拉菜單，然後點擊一個顏色的名稱，IMG SRC變化到designx_mockup-「顏色」巴紐

（顏色名稱應該從圖像的標題檢索），我希望它是不夠清楚明白，我會感激你的幫助

Answer 1

首先爲兩幅正面圖像添加一個圖像元素。每個圖片標籤都應該有一個id。

<img src="some_image.jpg" id="image_one"> 

然後創建一個選擇框，併爲每一個選項的文件名的值要

<select onchange="updateImage(this);"> 
    <option value="design1_mockup-black.png" >Black</option> 
</select> 

更新圖像功能將在事件（選項）的DOM節點。然後您可以獲取該值並將圖像設置爲新文件。