如何将JQuery求和输入值,然后乘以价格

时间:2017-02-12 02:26:31

标签: jquery

目前正致力于shopify,这是我正在处理的链接。

Link

当输入框中输入了一些数量但无法弄清楚时,我试图获得表中显示的总金额。

请帮忙。

这是我的代码。

HTML

<table>
    <thead style="background:#ccc;" >
        <tr>
            <th>Color</th>
            <th>Item #</th>
            <th>Pack</th>
            <th>Pack Price</th>
            <th>&nbsp;</th>
        </tr>
    </thead>
    <tbody>
{% for variant in product.variants %}
    {% if variant.available %}
        <tr class="{% cycle 'pure-table-odd', '' %}">
            <td>
                <a href="{{ variant.url | collection }}" >
                <center><img src="{{ variant.image | default: product.featured_image | img_url: 'small' }}" alt="{{ variant.title | escape }}" style="width:50px;" /></center>
                </a>
                <center><div>{{ variant.title }}</div></center>
            </td>
            <td>
                <a href="{{ variant.url | collection }}">
                <center>{{ variant.sku }}</center>
                </a>
            </td>
            <td>
                <center><div>
        {% if settings.show-quantity %}
                <input min="0" {% unless variant.inventory_management == blank or variant.inventory_policy == 'continue' %} max="{{ variant.inventory_quantity }}" {% endunless %} type="text" id="quantity" class="quantity addnumber" name="updates[{{ variant.id }}]" value="0" tabindex="1" />
        {% endif %}
                </div></center>  
            </td>
            <td>
                <center>{{ variant.price | money }}</center>
            </td>
        </tr>
    {% endif %}
{% endfor %}
    </tbody>
    <tfoot style="background:#ccc;">
        <tr>
            <td><center>&nbsp;</center></td>
            <td><center>Total</center></td>
            <td><center><input type='text' id='totaladdnumber' class="quantity" disabled /></center></td>
            <td><center><input type='text' id='totaladdprice' class="quantity" disabled /></center></td>
            <td><center>&nbsp;</center></td>
        </tr>
    </tfoot>
</table>

的Javascript

$('.addnumber').keyup(function () {

    // initialize the sum (total price) to zero
    var sum = 0;

    // we use jQuery each() to loop through all the textbox with 'price' class
    // and compute the sum for each loop
    $('.addnumber').each(function() {
        sum += Number($(this).val());
    });

    // set the computed value to 'totalPrice' textbox
    $('#totaladdnumber').val(sum);
});

0 个答案:

没有答案