jquery get Wert der nächsten Instanz der Klasse

Question

Ich versuche, jQuery zu verwenden, um den Wert der divs mit den Klassen von more_details_con, more_details_desc und more_details_res und wenn edit_entry geklickt zu bekommen, aber ich glaube nicht, dass ich das DOM bin richtig durchqueren weil die Warnung nur undefiniert sagt.

Die HTML

<div class="details"> 
    <span class="id">1234</span> 
    <span class="contact">account name</span> 
</div> 

<div class = "more_details"> 
    <div class = "more_details_btns"> 
     <div class="go_account">Go to Account</div> 
     <div class="edit_entry">Edit</div> 
     <div class="delete_entry">Delete</div> 
    </div> 
    <div class="container"> 
     <div class="more_details_title">Contact:</div> 
     <div class="more_details_con">Contact name</div> 
     <p class="clear"></p> 
    </div> 
    <div class="container"> 
     <div class="more_details_title">Description:</div> 
     <div class="more_details_desc">Actual Description</div> 
     <p class="clear"> 
    </div> 
    <div class="container"> 
     <div class="more_details_title">Resolution:</div> 
     <div class="more_details_res">Actual Resolution</div> 
     <p class="clear"> 
    </div> 
</div> 

Die jQuery Ich

$("#results").on("click", ".edit_entry", function() { 
    var contact = $(this).next(".more_details_con").html(); 
    var desc = $(this).next(".more_details_desc").html(); 
    var res = $(this).next(".more_details_res").html(); 
    alert(contact+desc+res); 
}); 

Answer 1

Das Problem ist, weil die Elemente, die Sie suchen versucht haben, nicht Geschwister des einen sind, die das Ereignis ausgelöst hat. Sie könnten stattdessen closest() verwenden, um das nächste gemeinsame übergeordnete Element zu finden, .more_details, und dann find(), um das gewünschte Element zu erhalten. Versuchen Sie dies:

$("#results").on("click", ".edit_entry", function() { 
    var $parent = $(this).closest('.more_details'); 
    var contact = $parent.find(".more_details_con").text(); 
    var desc = $parent.find(".more_details_desc").text(); 
    var res = $parent.find(".more_details_res").text(); 

    console.log(contact, desc, res); 
});