默認情況下在頁面加載時選擇圖片

我有一個JSON訂閱源，我提取這些值以填充產品大小，顏色/縮略圖的選擇菜單，並在提交時獲取對象中的值。默認情況下在頁面加載時選擇圖片

我所需要的是在默認情況下選擇圖像，如果其標題是匹配聲明並且在頂部（例如var initialColour = "Wheat";）初始化的變量的值。因此，如果initialColour是「Brown」，則應默認選擇標題爲「Brown」的圖片，並且下拉菜單中的尺寸應反映選擇。

這就是我想：

  if(mainImg.attr('title') == initialColour) { 
       $(this).addClass("active"); 
      }

這是下面的jsfiddle連接線27。

附：我也很感激任何有關結構的提示，我知道它是一團糟。

2014-02-17 Chris

是this fiddle做你想要的嗎？
我在兩處修改了一些代碼，我在那裏留下了原始的行作爲參考。基本上，我將圖像直接分配到mainImg。然後在添加類時使用它。此外，你錯過了一對夫婦的' S IN像HTML瀏覽：

問題的

$("<img src="+constructImageURL(mainImgID)+" id="+mainImgID+" class='colourThumb' title="+colour+" data-value='"+colour+"'> ")

2014-02-17 23:51:54 zord

它確實選擇了具有匹配標題的產品，但功能已損壞，確實存在很大差異（重複的產品不再被刪除等） – Chris

我以爲原始文件因爲使用了導論而被破壞。對不起，我更新了一個更正的鏈接。 – zord

答案接受;你有什麼不同嗎？任何公然的錯誤或不好的做法？我知道它不是真正的模塊化，也不是真的遵循任何設計模式，但是.. – Chris

部分原因是，你想在for環路內設置活動縮略圖，而不是供，jQuery的屬性選擇器可以使用：

 $("#colourId .colourThumb[title='"+initialColour+"']").each(function() { 
      $(this).addClass("active"); 
     });

我已經更新了原來的Fiddle顯示已創建，一旦所有動態元素，上面的語句，會做的伎倆。（Line 87）

就風格而言，可能需要查看一個數據綁定/模板框架（例如KnockoutJS），這會使代碼中的事情變得更加清晰。有一條學習曲線，但它對你正在做的事情是值得的。

2014-02-18 00:25:20

回答