javascript - 当选中复选框时,如何在金额值之前显示美元符号?

标签 javascript

如果未选中该复选框,它将显示 $0.00

当我选中该复选框时,它将显示1.00。我希望它显示 $1.00。我怎样才能做到这一点?

Demo on JS Fiddle

这是代码:

<form id="form1" method="post">
<input type="text" id="totalcost" value="$0.00">
<input type="checkbox" value="aa_1">
<input type="checkbox" value="aa_2">
<input type="checkbox" value="aa_3">
</form>


<script type="text/javascript">
var clickHandlers = (function () {
    var form1 = document.getElementById("form1"),
        totalcost = document.getElementById("totalcost"),
// if this is always the last input in the form, we could avoid hitting document again with
// totalcost  = form1[form1.length - 1];
        sum = 0;
    form1.onclick = function (e) {
        e = e || window.event;
        var thisInput = e.target || e.srcElement;
        if (thisInput.nodeName.toLowerCase() === 'input') {
            if (thisInput.checked) {

                var val = thisInput.value, // "bgh_9.99"
                split_array = val.split("_"), // ["bgh", "9.99"]
                pay_out_value = split_array[1]; // "9.99"
                sum += parseFloat(pay_out_value); // 9.99


            }  else {
                if (thisInput.type.toLowerCase() === 'checkbox') {

                    var val = thisInput.value, // "bgh_9.99"
                    split_array = val.split("_"), // ["bgh", "9.99"]
                    pay_out_value = split_array[1]; // "9.99"
                    sum -= parseFloat(pay_out_value); // 9.99


                }
            }
            totalcost.value = (sum > 0) ? sum.toFixed(2) : "$0.00";
        }
    }
    return null;
}());
</script>

最佳答案

只需更改此行:

totalcost.value = (sum > 0) ? sum.toFixed(2) : "$0.00";

totalcost.value = (sum > 0) ? "$" + sum.toFixed(2) : "$0.00";
                               ^

这将在您的价格前添加 $!

FIDDLE

关于javascript - 当选中复选框时,如何在金额值之前显示美元符号?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24433210/

相关文章:

javascript - 调整浏览器屏幕的两半

javascript - Google map 上的简单折线数量是否有最大数量限制?

javascript - setTimeout和匿名函数问题

javascript - 如何根据数据动态填充表

javascript - Fader 不同于 Div

javascript - 改变元素的尺寸

javascript - 在条件语句中指定数字范围 Javascript

javascript - Angular 2 绑定(bind)到组件选择器

javascript - 替代 HTML/Javascript 侧边栏小工具?

javascript - 为什么如果在使用之前访问由 Object.defineProperty 定义的属性,其行为会发生变化?