$(".popular").hide(); $(document).on("click", ".likeSee__state__filter--item", function (event) { $(".CaseNews").toggle(); $(".popular").toggle(); $(".likeSee__state__filter--item").removeClass('active'); $(this).addClass("active"); }); function get_data() { // var desid2=String(desid); // console.log(desid2); // $("#version").val(desid); // $("#version").html(desid); $.ajax({ method: "GET", url: "json/cases.json", dataType: "json", }) .done(function (msg) { console.log(msg); let designersinfo = ""; let CaseInfo = ""; let CaseTag = ""; let CaseData = ""; let CaseNews = ""; let CasePopular = ""; let CaseDetail = ""; for (let i = 0; i < msg.length; i++) { designersinfo = `

${msg[i].Casetitle}

${msg[i].CaseTeamName} | 圖片提供:${msg[i].CaseCompany}
${msg[i].CaseDate}| 人氣:${msg[i].CaseViews}
` CaseInfo = `
風格
${msg[i].CaseStyle}
格局
${msg[i].CaseHouse}
坪數
${msg[i].CaseSize}
預算
${msg[i].CaseProject}
` for (let j = 0; j < msg[i].CaseTag.length; j++) { // console.log(msg[i].CaseTag.length); // console.log(msg[i].CaseTag[j].Tag); CaseTag += ' \ '+ msg[i].CaseTag[j].Tag + ' \ '; } CaseData = `

CASE DATA

居住成員:
${msg[i].CaseDataMember}
房屋坪數:
${msg[i].CaseDataSize}
設計風格:
${msg[i].CaseDataStyle}
房屋類型:
${msg[i].CaseDataType}
房屋狀況:
${msg[i].CaseDataSituation}
圖片提供:
${msg[i].CaseDataImgProvide}
空間格局:
${msg[i].CaseDataSpace}
主要建材:
${msg[i].CaseDataMaterial}
` CaseData2 = `

聯絡設計師

` for (var k = 0; k < msg[i].ProfileRecently.length; k++) { CaseNews += '\
\
\ \ 幸福空間個案圖\ \
' CaseNews += '
' for (var z = 0; z < msg[i].ProfileRecently[k].ProfileTag.length; z++) { // console.log(msg[i].ProfileRecently[k].ProfileTag.length) CaseNews += '\ \ '+ msg[i].ProfileRecently[k].ProfileTag[z].Tag + '\ \ '; } CaseNews += '
' }; for (var x = 0; x < msg[i].ProfilePopularity.length; x++) { CasePopular += '
\
\ 幸福空間個案圖\
\ ' CasePopular += '
' for (var y = 0; y < msg[i].ProfilePopularity[x].ProfileTag.length; y++) { // console.log(msg[i].ProfileRecently[k].ProfileTag.length) CasePopular += '\ \ '+ msg[i].ProfilePopularity[x].ProfileTag[y].Tag + '\ \ '; } CasePopular += '
' }; // 個案細節 CaseDetail += '
' CaseDetail += // 輪播圖 '
\
\ \
\
' CaseDetail += '
\ \ ' CaseDetail += '\
\ ' CaseDetail += '
\
該個案的其他圖片(5/8)
\
\ ' for (let j = 0; j < msg[i].CaseDetail.length; j++) { CaseDetail += '
\ \ 該個案的其他圖片\ \
' }; CaseDetail += '
'; CaseDetail += '
'; CaseDetail += '
\
工業風 其他作品
\
\ ' for (let j = 0; j < msg[i].OtherStylePortfolio.length; j++) { CaseDetail += '
\ \ ' + msg[i].OtherStylePortfolio.PortfoliolImgAlt + '\ \
' }; CaseDetail += '
'; CaseDetail += '
'; CaseDetail += '
\
CASE DATA
\
\
\
\
裝潢費用:
\
\
\
'+ msg[i].CaseProject + '
\
\
\
\
\
居住成員:
\
\
\
'+ msg[i].CaseDataMember + '
\
\
\
\
\
設計風格:
\
\
\
'+ msg[i].CaseStyle + '
\
\
\
\
\
房屋類型:
\
\
\
'+ msg[i].CaseDataType + '
\
\
\
\
\
房屋坪數:
\
\
\
'+ msg[i].CaseSize + '
\
\
\
\
\
房屋狀況:
\
\
\
'+ msg[i].CaseDataSituation + '
\
\
\
\
\
圖片提供:
\
\
\
'+ msg[i].CaseCompany + '
\
\
\
\
\
空間格局:
\
\
\
'+ msg[i].CaseDataSpace + '
\
\
\
\
\
主要建材:
\
\
\
'+ msg[i].CaseDataMaterial + '
\
\
\
\
'; CaseDetail += '
'; CaseDetail += '
\
聯絡資訊 Info
\ \
' CaseDetail +='
' } $('.article').html(designersinfo); $('.CaseInfo').html(CaseInfo); $('.CaseTag').html(CaseTag); $('.caseData-PC-left').html(CaseData); $('.caseData-PC-right').html(CaseData2); $('.CaseNews-Card').html(CaseNews); $('.Case-popular').html(CasePopular); $('.CaseModel').html(CaseDetail); }); } get_data();