【问题标题】:If Checkbox checked perfom a function如果复选框选中执行一个功能
【发布时间】:2013-05-29 10:22:57
【问题描述】:

我有这个网站,我需要在选中复选框时将值添加到 SUB TOTAL。

值以 $ 为单位,类似于 <?php echo $rare['value']; ?>

现在复选框是这个<input type="checkbox" name="buy" value="buy">Buy<br>

所以我想,当多个复选框被选中时,它们将每次的价格(或价值)添加到 SUB TOTAL 中。

谢谢!

【问题讨论】:

    标签: php jquery forms checkbox


    【解决方案1】:

    检查是否为该字段提交了 POST 值:

    if (isset($_POST['buy'])) {
      // do something with your value
    }
    

    【讨论】:

    • 它基本上是一个商店,并且会有一个产品列表,因此将为您要购买的产品选择复选框,当您选择它们​​时,价格将在小计框
    【解决方案2】:

    如果你有多个复选框,你也可以给它一个数组的名字,让它更容易:

    <input type="checkbox" value="1" name="values[]"'>
    <input type="checkbox" value="2" name="values[]"'>
    ...
    

    要检查您简单的值:

    if(isset($_POST['values'])) {
      // do stuff
    }
    

    【讨论】:

    • 它基本上是一个商店,并且会有一个产品列表,因此您要购买的产品将选中复选框,当您选中它们时,价格将在小计框
    • 你是想在现场直播(ajax+jquery),还是在用户点击提交之后?
    • 是的,但您只需将复选框的属性发送到 javascript 函数,该函数将调用 ajax 请求并编辑价格.. 这完全不同。跨度>
    • 会更简单吗,如果我列出了带有名称和价格的产品列表,然后在最后一个提交框和确认页面上显示小计?
    • 我应该怎么做才能只添加选定的那些?
    【解决方案3】:

    试试这个

    <html>
    <head></head>
        <body>
            <form>
                <input type="checkbox" value="100" name="values[]" class="buyThis">
                <input type="checkbox" value="200" name="values[]" class="buyThis">
                <input type="checkbox" value="300" name="values[]" class="buyThis">
                <div><span>SUB TOTAL : $</span><span id="subTotal">0</span></div>
            </form>
        </body>
        <script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>
        <script type="text/javascript">
        $(function() {
            $('.buyThis').removeAttr('checked');
            $('.buyThis').on('click', function(){
                var subTotalVal = Number($('#subTotal').text());
                if ($(this).is(':checked')) {
                    subTotal = eval(subTotalVal) + eval($(this).val());
                } else {
                    subTotal = eval(subTotalVal) - eval($(this).val());
                }
                $('#subTotal').text(subTotal);
            });
        });
    </script>
    </html>
    

    【讨论】:

      猜你喜欢
      • 2017-12-10
      • 2016-07-20
      • 2018-06-05
      • 2016-07-02
      • 2016-01-31
      • 1970-01-01
      • 1970-01-01
      • 2021-12-24
      • 2022-11-27
      相关资源
      最近更新 更多