選擇特定的DOM到幻燈片

我有一些itemBox，我需要點擊itemBox並調用工作項目具有同一ID號SildeUp（工作項被隱藏在一開始）。選擇特定的DOM到幻燈片

當其中一個workItem SlideUp時，其他人將被隱藏。

<div class="container"> 
    <div class="row"> 
     <div class="wrapper"> 
      <div class="itemBox" id="item0"> 
       <img src="img/default.jpg" alt=""> 
       <div>titletitle</div> 
      </div> 

      <div class="itemBox" id="item1"> 
       <img src="img/default.jpg" alt=""> 
       <div>titletitle</div> 
      </div> 
     </div> 
    </div> 

</div> 

<div class="workContent"> 
    <div class="workItem" id="work0" style="background-color:#000000;"> 
     <h2>demo1</h2> 
     <img src="img/default.jpg" alt=""> 
     <div>contentcontentcontentcontentcontentcontent</div> 
     <div>contentcontentcontentcontentcontentcontent</div> 
     <div>contentcontentcontentcontentcontentcontent</div> 
     <div>contentcontentcontentcontentcontentcontent</div> 
    </div> 

    <div class="workItem" id="work1" style="background-color:#333333;"> 
     <a class="close" href="javascript:">x</a> 
     <h2>demo2</h2> 
     <img src="img/default.jpg" alt=""> 
     <div>contentcontentcontentcontentcontentcontent</div> 
     <div>contentcontentcontentcontentcontentcontent</div> 
     <div>contentcontentcontentcontentcontentcontent</div> 
     <div>contentcontentcontentcontentcontentcontent</div> 
    </div> 
</div>

我怎麼能做到這一點與JavaScript或jQuery的？

來源

2017-10-12 lin

歡迎的StackOverflow！你到目前爲止嘗試過什麼嗎？ StackOverflow不是一個免費的代碼寫入服務，並且期待你 [嘗試先解決你自己的問題]（http://meta.stackoverflow.com/questions/261592）。請更新您的問題，以顯示您已經嘗試過的內容，顯示您在 [最小，完整和可驗證示例]（http://stackoverflow.com/help/mcve）中遇到的具體問題。欲瞭解更多信息，請參閱 [如何問一個好問題]，並採取 [網站之旅]（http：// http：// stackoverflow.com/tour） –

這是簡單的（我用的jQuery）：

$(".itemBox").click (function(){ 
    $("div[id^=work]").hide(); 
    var id = $(this).attr("id"); 
    var number = id.match(/item([0-9]+)/)); 
    if (number[1]) 
     $("div[id=work" + number[1] + "]").show(); 
})

來源

2017-10-12 04:16:08 diavolic

選擇特定的DOM到幻燈片

回答

相關問題