zeigen div abhängig von Wert

Question

Ich versuche, ein div auf den Gesamtwert meiner wählt anhand ein- oder auszublenden:

Hier ist eine Demo: https://jsfiddle.net/wrfvukjv/

<script type="text/javascript"> 
function recalculate() { 
    var sum = 0; 
    $("input[type=radio]:checked").each(function() { 
     sum += parse($(this).val()); 
     }); 
    $("#sum").html(sum.toFixed(2)); 
} 

$("input[type=radio]").change(function() { 
    recalculate(); 
}); 

</script> 

ich hier versucht:

if (sum > 2) 
{ 
    console.log('showmessage'); 

} 
else 
{ 
    console.log('no message'); 
} 

aber es gibt einfach keine Nachricht

Answer 1

Hier können Sieaktualisiert 0

Javascript:

function recalculate() { 
    var sum = 0; 
    $("input[type=radio]:checked").each(function() { 
     sum += parseFloat($(this).val()); 
     }); 
    $("#sum").html(sum.toFixed(2)); 
    if(sum >= 2) $("#message").show(); 
    else $("#message").hide(); 
} 

$("input[type=radio]").change(function() { 
    recalculate(); 
}); 

und HTML für Ihre Nachricht:

<div id="message"> 
    Show message IF overall sum is >= 2<br> 
    Hide if < 2 
</div> 

Und ein wenig CSS für das Ausblenden der #message wenn Laden der Seite:

#message { 
    display: none; 
} 

Answer 2

Sie können fügen Sie eine Bedingung am Ende Ihrer recalculate() Funktion hinzu:

function recalculate() { 
    var sum = 0; 
    $("input[type=radio]:checked").each(function() { 
     sum += parseFloat($(this).val()); 
     }); 
    $("#sum").html(sum.toFixed(2)); 

    if(sum >= 2){   
     $("#message").show(); 
    }else{ 
     $("#message").hide(); 
    } 
} 

Answer 3

Kann mit weniger Code auch getan werden. Siehe unten. #message zunächst versteckt und wenn :radio:checked Wertsumme größer oder gleich 2 ist, zeigen Sie #message

CSS

#message{ 
    display:none 
} 

JQUERY

var sum=0; 
$("input[type=radio]").change(function() { 
    sum=sum+parseInt($(this).val());//ASSUMING VAL TO BE INT ONLY 
    sum>=2?$("#message").show():$("#message").hide() 
}); 

WORKING FIDDLE