針對點擊的div與jquery

我有這塊代碼，當我懸停（點擊這個例子雖然但最終懸停）的目的，在一個特定的盒子上，我想以通用jQuery代碼爲目標該div。我希望div內的圖像隱藏並顯示一個新的div，並將寬度設置爲250px。一直試圖針對第二類的div但無濟於事。任何人有任何想法？針對點擊的div與jquery

$(document).ready(function(){ 
     $('.partner_box').click(function() { 
      var hidden_div; 
      hidden_div = $(this).attr('class').eq(1); 
      //hidden_div = $(hidden_div).eq(1).html(); 

      //hidden_div = hidden_div:nth-child(1); 

      $(hidden_div + ' img').hide(); 
      console.log(hidden_div); 

      //alert(hidden_div); 
      //alert($(hidden_div).attr('class').split(' ')[1]) 

      /*$('.partner_box div').animate({ 
       top: '0px', 
       right: '0px', 
       bottom: '0px', 
       left: '0px', 
       display: 'block', 
       position: 'absolute', 
       width: '200px' 
      });*/ 
     }); 
    }); 

    <div id="partner_grid"> 
     <!--LINE ONE--> 
     <div class="partner_box partner_box1"> 
      <img src="images/partners/asx.jpg" alt="ASX" /> 
      <div style="display:none;"> 
       <p>This is the text for the slide.</p> 
      </div> 
     </div> 
     <div class="partner_box partner_box2"> 
      <img src="images/partners/beauchamp.jpg" /> 
      <div style="display:none;"> 
       <p>This is the text for the slide.</p> 
      </div> 
     </div> 
     <div class="partner_box partner_box3"> 
      <img src="images/partners/decillion_group.jpg" /> 
      <div style="display:none;"> 
       <p>This is the text for the slide.</p> 
      </div> 
     </div> 
     <div class="partner_box partner_box4"> 
      <img src="images/partners/dtcc.jpg" /> 
      <div style="display:none;"> 
       <p>This is the text for the slide.</p> 
      </div> 
     </div> 
    </div>

來源

2012-03-21 Dave Rottino

我無法有效地解析類，所以我只爲每個幻燈片創建了唯一的ID。

$('.partner_box').click(function() { 
    var hidden_div; 
    hidden_div = $(this).attr('id'); 
});

感謝所有的幫助。

來源

2012-03-27 20:46:01

試圖改變：

$(hidden_div + ' img').hide();

到：

$('.' + hidden_div + ' img').hide();

因爲你的目標的一類，你需要一段時間來前言類。這似乎被排除在外。

來源

2012-03-21 20:40:31

嗨，我不完全確定你要完成什麼。這是一個隱藏子圖像並顯示子div的示例

$(document).ready(function(){ 
     $('.partner_box').click(function() { 

      var my_image = $(this).find("img"); 
      var hidden_div = $(this).find("div"); 

      my_image.hide(); 
      hidden_div.show(); 


     }); 
    });

關鍵字「this」綁定到觸發事件的元素。因此，當您將一個點擊事件處理程序附加到所有具有.partner-box類的div時，只會在生成事件時單擊該事件。

來源

2012-03-21 20:57:01 Jrod

請記住，當你在這樣的事件中時，$(this)引用了單擊的特定元素。並非所有使用您選擇的選擇元素。

看看這個的jsfiddle：http://jsfiddle.net/ufomammut66/6y9XY/

如果你點擊一個元素，並檢查了在控制檯你會發現我有傾出$(this)元素。在FireFox中，如果您安裝了FireBug，則將鼠標移到輸出上會顯示元素$(this)在這種情況下引用的內容。您應該注意到，輸出元素特定於點擊元素。

從那裏你應該可以做任何你需要的動畫。

來源

2012-03-21 21:00:21 ShortRound1911

針對點擊的div與jquery

回答

相關問題