打開一個鏈接和一個div同時

Question

前幾天我試圖創建一個系統，jQuery將讓我來顯示一個鏈接，當你點擊一個div，一切關於

鏈接到項目：http://jsfiddle.net/HCAfz/

一個主要的條件是，當你點擊一個打開的鏈接，只改變一個div的狀態，而不是全部在頁面上。

我在每個類別中都有這樣一個div，並且在css div中創建了單獨的類，錯過了這一點。

我的項目能在jquery中完成什麼？任何建議

Answer 1

你可以做這樣的事情，使用next：

http://jsfiddle.net/HCAfz/2/

$('a.yourLink').click(function(event) { 
     event.preventDefault(); 
     event.stopPropagation(); 
     $(this).next('.hiddenDiv').show(); 
     window.open(this.href, '_blank'); 
}); 

Answer 2

如果你想改變一個div的內容，特別是通過一個ID來調用它。只需設置屬性id =「東西」，並用jQuery調用它：$（「＃東西」）HTML（「添加此HTML到DIV」）

這是非常相似，當你用CSS工作。只需指定一個ID或類，並通過它設置您的樣式規則。

Answer 3

您可以使用更通用的程序。

<a href="http://www.yoursite.com/otherLink" 
    id="yourId" 
    class="opens-a-link-and-shows-a-div">Click here</a> 
<div id="div-to-show-when-yourId-clicked" style="display: none"> 
    Your link has opened in a new window 
</div> 

和JavaScript

$('a.opens-a-link-and-shows-a-div').click(function(event) { 
     event.preventDefault(); 
     event.stopPropagation(); 
     var div_name = '#div-to-show-when-%-clicked' 
      .split('%').join($(this).attr('id')); 
     $(div_name).show(); 
     window.open(this.href, '_blank'); 
}); 

（見我fork）

Answer 4

如果我正確理解你的問題，你的HTML的擴展版本是這樣的：

    <a href="http://www.yoursite.com/otherLink" target="blank_" id="yourId">Click here</a> 
    <div class="hiddenDiv">Your link has opened in a new window</div> 
    <div class="hiddenDiv">Your 2nd link has opened in a new window</div> 
    <div class="hiddenDiv">Your 3rd link has opened in a new window</div> 
    <div class="hiddenDiv">Your 4th link has opened in a new window</div> 

您可以使用此jQuery的相同類別的鏈接，而不是後僅打開DIV別人：

    $('a#yourId').click(function(event) { 
      event.preventDefault(); 
      event.stopPropagation(); 
      $(this).next('.hiddenDiv').show(); 
    });