最後點擊的元素

Question

我有div的名單如下：

<div class="item">Click</div> 
<div class="content">Hidden Content</div> 
<div class="item">Click</div> 
<div class="content">Hidden Content</div> 
<div class="item">Click</div> 
<div class="content">Hidden Content</div> 
<div class="item">Click</div> 
<div class="content">Hidden Content</div> 
<div class="item">Click</div> 
<div class="content">Hidden Content</div> 

當頁面加載它有ID的內容顯示在第一個div。我想要做的是當我點擊某個其他div（id =「item」）來隱藏先前點擊的項目的內容並對之前點擊的div（id =「item」）做一些更改時。到目前爲止，我試過這個：

$(document).ready(function(){ 
     $(".item").first().css("border-right","none"); 
     $(".item").click(function(e) { 
     $pressed = $(this); 
      if ($pressed.data("lastclick")){ 
        $pressed.data("lastclick").css("border-right","solid"); 
        $pressed.data("lastclick").css("border-right-width","1px"); 
        $pressed.data("lastclick").find("span").remove(); 
      } 
    $(this).next(".content").slideToggle(\'slow\', function() { 
       if ($(this).is(":visible")) { 
         $pressed.css("border-right","none"); 
         $pressed.append(\'<span style="float:right;font-weight:bold">\'+$(this).children().length+\'</span>\'); 
         $pressed.data("lastclick",$pressed);  
      } 
      });});}); 

Answer 1

存放在一個簡單的JavaScript最後單擊項目變量

var lastClicked; 
$(".item").click(function(e) { 
    $(this). // Do your stuff to the clicked element here 

    // Then do what you will to the last-clicked element 
    // ... 

    // And finally assign the clicked element to the lastClicked variable 
    lastClicked = clicked; 
} 

一些有用的提示：

• 如前所述在評論中，。是類選擇器，＃是ID選擇器。你在你的例子中試圖通過使用類選擇器的ID來選擇一個元素。

• 我在哪裏有$(this)您可以鏈接運營商。也就是說，您可以將CSS運算符與其他運算符鏈接起來，並使用一條單一的鏈接命令而不是重複選擇器（這是一種性能浪費）。

• 您可以使用 「地圖」 用的.css（）命令同時應用多個樣式，像這樣：

的.css（{右邊框： '固體'，border-右寬度：「1px的」}）

...但在你的情況下，你只是修改邊界，你可以（也應該）僅僅做到這一點：

border-right: 1px solid black; 

Answer 2

你可以通過做一些簡單的事情來做到這一點。

JSFIDDLE

$('.item').click(function(){ 
    $('.content').slideUp(); 
    $(this).next('.content').slideDown()   
})​