javascript - 当表单元素未选中时,如何减去 javascript 变量的值

标签 javascript jquery html forms

请注意,这不是我的代码,也不是表单中的实际代码。这只是我的测试版本,但确实代表了我想要做的事情。

给定以下代码,如何让脚本在取消选中复选框时减去传递的值:

<!DOCTYPE html>
<html lang="en">

    <head>
        <title>form test</title>
        <script type="text/javascript" charset="utf-8" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
        <script type="text/javascript">
            function updateAmount(amount) {
                parseInt(amount);
                if ($('#amount').val()) {
                    parseInt(amount);
                    amount = amount + parseInt($('#amount').val());
                }
                $('#amount').val(amount);
                alert('Amount: ' + $('#amount').val());
            }
        </script>
    </head>

    <body>
        <form action="" method="post" name="form-test">
            <input onclick="updateAmount(150)" class="inputbox" id="reservationfee0"
            value="Registration Fee" type="checkbox" />
            <strong>$150</strong>Reservation Fee</form>
    </body>

</html>

就目前情况而言,无论是谁编写了该函数,都没有考虑到人们在提交表单之前可能会选中和取消选中该框(其中包括在提交之前添加到 amount 变量中的更多字段和其他数字)。有一些关于因此而过度收费的报告,所以我需要弄清楚如何阻止它发生,但我对 javascript/jquery 知之甚少。

最佳答案

尝试:

function updateAmount(amount) {
    $amount = $('#amount'); // cache for later use
    if ($('#reservationfee0').is(':checked')) {
        $amount.val(parseInt($amount.val(), 10) + amount);
    } else {
        $amount.val(parseInt($amount.val(), 10) - amount);
    }
}​

<强> Working example here

这会检查是否使用.is()选中了复选框如果是,则将金额添加到当前值(如果不减去)。

另请注意,parseInt 采用第二个参数 - radix,建议您包含此值以确定结果... docs for parseInt here

关于javascript - 当表单元素未选中时,如何减去 javascript 变量的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11192862/

相关文章:

javascript - 不使用鼠标提交表单时会调用提交按钮的onclick事件吗?

javascript - 我如何用 2 个不同的图像切换 div

javascript - 如何从geojson openlayers3获取图像源

html - 修复一行表格的右边框线

javascript - meteor js写的静态HTML?嵌入 &lt;iframe&gt;

jquery - XML 的 DOM 对象到 HTML

javascript - 检查类的所有输入是否都有值

jquery - 禁用 div 内的所有 <a> 和 <i>

javascript - 鼠标悬停时工具提示未正确显示

html - 3 个等宽的 Div 在 Div 内居中(干净无 float )