2011-01-09 102 views
-1
$(".refine_button").click(function(){ 
var butt = $(this); 
$(this).next(".refine_block").slideToggle("normal", function(){ 
     butt.children(".refine_icon").toggleClass("opened"); 
     }); 
}); 

特別地,「butt.children」這段代碼在簡單英語中意味着什麼?

由於

+0

這裏有一個提示:前兩行`butt.children`,有啓動`VAR對接=`線。 – 2011-01-09 22:42:36

+0

什麼是上下文? – 2011-01-09 22:42:39

+1

我很認真!我在google上找不到關於butt.children做了什麼的任何內容,但是如果我刪除它,我的代碼無法正常工作。具體而言,當單擊一個.refine_button時,頁面上的每個.refine_icon元素都會將該類打開。 – Anthony 2011-01-09 23:17:45

回答

2
$(".refine_button").click(function(){ // when an element with the class refine_button is clicked 
    var butt = $(this); // store a reference to the element clicked 
    $(this).next(".refine_block") // get the next element if it has a class refine_block 
     .slideToggle("normal", function(){ // and slide it open or closed, depending on its current status 
      // when that animation is finished 
      butt.children(".refine_icon") // get any children of the original clicked element that have the class refine_icon 
       .toggleClass("opened"); // and add or remove the class opened, depending whether they currently have it 
     }); 
}); 
2

與類被點擊會發現元件以一類「refine_block」,要麼「滑動」「refine_button」的任何按鈕它進入或退出(取決於它是否已經進入或退出,它會調用相反的)。當幻燈片完成時,它會將一個類添加到受影響的「refine_block」中名爲「opened」的「refine_icon」元素中。這隻會影響直接與被點擊的原始「refine_button」相鄰的代碼中的下一個元素。

0

butt是一個包含jQuery對象的變量;其中包含一個元素(被單擊的類爲refine-button的元素)

children函數返回jQuery對象中的元素的子元素,可選地通過選擇器進行過濾,以便檢索子元素的子元素(並且順便說一句,您正在切換「已打開」的類)

0

當您單擊應用了「refine_button」類的元素時,jQuery會查找下一個應用了「refine_block」類的頁面元素,並摺疊或展開它(通過slideToggle方法)。一旦slideToggle完成,它將添加或移除所有「refine_icon」元素上的「打開」類在「re」中定義fine_block」。

0

問題的興趣:

  1. 這將適用於任何元素與refine_button類,不只是按鈕 - 甚至div或圖像。如果一隻狗被稱爲「Kitty」,它仍然是一隻狗。
  2. children將只返回直接父元素的子元素,不深查找。
  3. butt被聲明爲保留父元素,因爲$(this)將在slideToggle函數內部具有不同含義。