Jquery 显示依赖于值的div

我正在尝试根据所选内容的总体值显示或隐藏div：

下面是一个演示：

但它只是不返回任何消息

这是您的最新消息

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();
});

和您的邮件的HTML：

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

---

您可以在“重新计算”函数的末尾添加条件：

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();
    }
}

---

也可以用更少的代码完成。见下文。 消息最初是隐藏的，当：radio:checked值之和大于或等于2时，显示消息

CSS

JQUERY

---

显示或隐藏div的条件是什么？@james_bond我已将我的尝试添加到posit中，直到您取消选择，所以如果我显示它，然后更改选项，消息仍然保留？ifsum>=2{$message.show；}否则{$message.hide；}

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

#message {
  display: none;
}

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();
    }
}

#message{
  display:none
}

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()
});