Setzen von var auf verschachtelte HTML-Elemente Textwert

Question

Also ich möchte den Wert von "verschachtelt" von "Toplevel" bekommen und subtrahiere es von "total". Ich bin mir sicher, dass mein Code mega ineffizient ist, verzeih mir.

HTML:

<span class="toplevel"> 
    Clickable 
    <span class="nested"> 50 </span> 
</span> <br> 

All put together is... 
<div id="total"> 
    9999 
</div> 

JS:

$(document).ready(function() { 
    var totalcp = parseInt("9999", 10); 
    $('#total').text(totalcp).toString(); 
    $('.toplevel').click(function() { 
     var cpcost = ('.nested'); 
    totalcp = totalcp - cpcost; 
    $('#total').text(totalcp).toString(); 
    }); 
}); 

Mein Hauptproblem ist die Zeile:

var cpcost = ('.nested'); 

Ich weiß, ich bin fehlt nur etwas dumm !!!! Danke im Voraus.

Codepen link - von der obigen Kombination ist das Problem wiederum, dass var cpcost nicht den "verschachtelten" Wert erhält. Wenn es durch eine flache Zahl ersetzt wird, funktioniert es gut.

Answer 1

Sie haben vergessen $ im folgenden Code hinzuzufügen:

var cpcost = ('.nested'); 

ersetzen, die mit dem folgenden Code funktionieren sollte:

var cpcost =parseInt($(this).find('.nested').text()); 

Um .nested im aktuellen geklickt Spanne zu finden (.toplevel), können Sie einfach $(this) verwenden. Dadurch begrenzen Sie die Abfrage auf das angeklickte Element. Um ein bestimmtes Element einfach zu finden, können Sie auch die Funktion find in jQuery verwenden.