jqueryのタグがクリックされた子を知ること

Question

私は以下のDOM構造を持っています。これはh4のクリックに基づいています。対応するクラスウィジェットのIDを取得し、サーバーに投稿要求を行う必要があります。私はjQueryに少し苦しんでいます。誰も助けてくれませんか？

<section id="home-sidebar" class="sidebar"> 
    <div class="menu"> 

    <div class="widget" id="4"> 
     <div class="title"> 
     <h4>First Text</h4> 
     <p>Do some stuff</p> 
     </div> 
    </div> 
    .................................. 
............... 

    <div class="widget" id = "56"> 
     <div class="title"> 
     <h4>N-th Text</h4> 
     <p>Do some stuff</p> 
     </div> 
    </div> 
    </div> 
</section> 

どのh4タグがjQueryでクリックされたのか分かりませんか？どのように私はウィジェットの対応する "ID"番号を取得するのですか？あなたは、このやった場合

Answer 1

することができます.parents()を使用して取得するIDのDOMノードを探します。

//bind a click handler to all h4 elements 
$('h4').bind('click', function() { 
    //find the id of the parent node that has the .widget class 
    //since you are trying to get the id, you do not need to use the jQuery .attr() function which performs slower than the below code 
    var id = $(this).parents('.widget')[0].id; 
    $.get('path/to/server.file?id=' + id, function (data) { 
     //this is the callback function for the server request 
     alert('Server Response: ' + data); 
    }); 
}); 

ため

ドキュメント：http://api.jquery.com/parents/

Answer 2

を（IDは、彼らが同様にランダムでできる連続しないことに注意してください）：

$('h4').click(....) 

をあなたはこのようにそれを行うことができます。

$('h4').click(function(){ 
    alert($(this).attr('id')) 
}) 

Answer 3

$(document).ready(function(){ 
    $(".widget").click(function(){ 
     var id = $(this).attr("id"); //gives id 
    }); 
}); 

Answer 4

$("h4").click(function(){ 
    var a=$(this).parent().parent().attr('id'); 
    alert(a); 
})