現在開いているdiv内のdivを開く

Question

<table id="tab"> 
    <tr><td class="click" id="111">111</td> <td id="222" class="click">222</td></tr> 
    <tr><td class="click" id="333">333</td> <td id="444" class="click">444</td></tr> 
</table> 

<div id="hidden"> 
    text 
</div> 

#tab tr td { 
padding: 10px; 
    border: solid 1px red; 
} 

#hidden { 
    background-color:green; 
    width: 40px; 
    height: 40px; 
    display: none; 
} 

$(".click").click(function(){ 
    $("#hidden").show(); 
}) 

現在のクリックされたTDでdivを開く方法？ #hiddenの外をクリックすると、このdivを非表示にしたいと思います。

フィドル：http://jsfiddle.net/QyRnH/2/

Answer 1

を、私はあなたが「どのように何を意味するかわからないんだけど開いているdiv＃現在のクリックしたTDに隠れている "が、を表示して非表示にするhttp://jsfiddle.net/QyRnH/7/

<table id="tab"> 
    <tr> 
    <td class="click" id="111">1</td> 
    <td class="click" id="222">2</td> 
    </tr> 
    <tr> 
    <td class="click" id="333">3</td> 
    <td class="click" id="444">4</td> 
    </tr> 
</table> 

<div id="hidden">text</div> 

$(".click").click(function(e){ 
    $("#hidden").show(); 
    $("#hidden").appendTo($(this)); 
    e.stopPropagation(); 
}); 
$(document).click(function() { 
    $('#hidden').hide(); 
}); 

Answer 2

ここに行く：http://jsfiddle.net/maniator/QyRnH/6/

HTML：

<table id="tab"> 
    <tr> 
     <td class="click" id="111"> 
     111 
      <div class="hidden"> 
       text 
      </div> 
     </td> 
     <td id="222" class="click"> 
      222 
      <div class="hidden"> 
       text 
      </div> 
     </td> 
    </tr> 
    <tr> 
     <td class="click" id="333"> 
      333 
      <div class="hidden"> 
       text 
      </div> 
     </td> 
     <td id="444" class="click"> 
      444 
      <div class="hidden"> 
       text 
      </div> 
     </td> 
    </tr> 
</table> 

JS：

$(".click").click(function() { 

    $(".hidden").hide(); 
    $(".hidden", this).toggle(); 

}); 

Answer 3

左とトップを変更するには

$(".click").click(function(){ 
    $("#hidden").show(); 
    $("#hidden").offset($(this).offset()); 

}); 

以下のようなものを試してみてください、あなたがクリックしたときのdivを非表示にするには

$("#hidden").offset({top: $(this).offset().top, left: $(this).offset().left+10}); 

ような何かを書くことができます：あなたはこのように行うことができますdivの外では、Krister Anderssonが投稿した回答を参照してください。

Answer 4

$(".click").click(function(){ 
    $("#hidden").show(); 
    $(this).append($("#hidden")); 
})