【问题标题】:How to make a sum of number fields to single field in contact form 7 in wordpress如何在wordpress中的联系表格7中将数字字段总和到单个字段
【发布时间】:2016-02-29 21:30:46
【问题描述】:

以下是联系表格7中的表格代码,

<table>
<tr>
<th>RX #</th>
<th>Amount</th>
</tr>
<tr>
<td>[number RX1 placeholder "RX1"]</td>
<td>[number RX1Amount placeholder "RX1 Amount"]</td>
</tr>
<tr>
<td>[number RX2 placeholder "RX2"]</td>
<td>[number RX2Amount placeholder "RX2 Amount"]</td>
</tr>
<tr>
<td>[number RX3 placeholder "RX3"]</td>
<td>[number RX3Amount placeholder "RX3 Amount"]</td>
</tr>
<tr>
<td>[number RX4 placeholder "RX4"]</td>
<td>[number RX4Amount placeholder "RX4 Amount"]</td>
</tr>
<tr>
<td>[number RX5 placeholder "RX5"]</td>
<td>[number RX5Amount placeholder "RX5 Amount"]</td>
</tr>
<tr>
<td>Total Amount</td>
<td>[number TotalAmount]</td>
</tr>
</table>

我希望对金额列求和,这样当我在任何字段中输入数字/金额时,它应该在最后一行中更新,如果我在多行中输入数字/金额,则为所有行的总和应该在最后一行更新。

为了更清楚地理解,请查看下图。

谁能帮帮我?

【问题讨论】:

  • TotalAmount 应该在用户更改any 其他input[type="number"] 时更新?该值应该是所有其他 10 个字段的总和,还是只是 5 个“金额”字段的总和?
  • 只有5个数量,第二列的字段应该得到总和。这 5 个金额字段的总和应在最后一个字段中更新。

标签: plugins wordpress contact-form-7


【解决方案1】:

我没有测试这段代码,但如果它没有运行,至少它会帮助你找出解决方案。我在金额字段中添加了一个类,在总计字段中添加了一个 id,在输入字段中添加了一个函数,每次字段的值更改时都会触发:

<table>
<tr>
<th>RX #</th>
<th>Amount</th>
</tr>
<tr>
<td>[number RX1 placeholder "RX1"]</td>
<td>[number RX1Amount class:amount-field placeholder "RX1 Amount"]</td>
</tr>
<tr>
<td>[number RX2 placeholder "RX2"]</td>
<td>[number RX2Amount class:amount-field placeholder "RX2 Amount"]</td>
</tr>
<tr>
<td>[number RX3 placeholder "RX3"]</td>
<td>[number RX3Amount class:amount-field placeholder "RX3 Amount"]</td>
</tr>
<tr>
<td>[number RX4 placeholder "RX4"]</td>
<td>[number RX4Amount class:amount-field placeholder "RX4 Amount"]</td>
</tr>
<tr>
<td>[number RX5 placeholder "RX5"]</td>
<td>[number RX5Amount class:amount-field placeholder "RX5 Amount"]</td>
</tr>
<tr>
<td>Total Amount</td>
<td>[number TotalAmount id:total-amount]</td>
</tr>
</table>

Js代码:

jQuery(document).ready(function($) {
    var $amount_fields = $('.amount-field'),
        $total_amount = $('#total-amount');

    $amount_fields.on('input', function(e) {
        var final_value = 0;
        $amount_fields.each(function() {
            var value = $(this).val();
            if (!isNaN(value) && value > 0) final_value += parseInt(value);
        });
        $total_amount.val(final_value);
    })
});

希望对你有帮助!

【讨论】:

  • 谢谢,我试试这个
  • 您好 Felipe Elia,再次感谢代码正常工作,但输出不正确,如果我保留 1、2、3 等值,则不会添加它们正在连接的数量, 4, 5,输出应该是所有值的总和,即 15,但我得到 012345 作为输出。请帮帮我。
  • 尝试使用final_value += parseInt(value);。如果它有效,我会更新我的答案。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2019-04-13
  • 2012-09-13
  • 1970-01-01
  • 2017-12-19
  • 2018-08-11
  • 1970-01-01
  • 2018-04-11
相关资源
最近更新 更多