jQuery Ajax 乘法

Question

我需要你的帮助！我想将数量乘以单价并使用Ajax将其放入名为total的id中（我不太了解Ajax）

$(function () {
    "use strict";
    $('.qty').on('keyup', function () {
        var singl_price = $(".single_price").val(),
            qty = $(".qty").val(),
            total_price = qty * singl_price;
            $("#total").text(total_price);

        $.ajax({
            url: 'cart.php',
            type: 'POST',
            data: '',
            success: function (data) {
                if (data === "ok") {                    
                }
            },
            error: function (e) {
            }
        });    
    });   
});

<form action="cart.php" method="post" >
  <input type="text" name="qty" class="qty" value="<?php echo $_POST['qty']; ?>" />
</form>

<div class="single_price"> 20 </div>

<div id="total"> </div>

Answer 1

尝试：

$('.qty').on('keyup', function () {
        $.ajax({
            url: 'cart.php',
            type: 'POST',
            data: {total_price:total_price},
            success: function (data) {
                   var total = 0;
                   $('.qty').each(function(i,v){
                   var singl_price = $(v).next(".single_price").text();
                   var qty = $(v).val().length > 0 ?$(v).val():0;

                  total +=  parseInt(qty) * parseInt(singl_price);
                  });
                  $('#total').text(total);

                if (data === "ok") {                    
                }
            },
            error: function (e) {
            }
        });    
    });

html:

<form action="cart.php" method="post" >
      <input type="text" name="qty" class="qty" value="<?php echo $_POST['qty']; ?>" />
    <div class="single_price"> 20 </div>
    </form>



<div id="total">0</div>

https://jsfiddle.net/o7hb7s6g/2/

注意：如果您的价格是 3.99

，请使用 parseFloat 而不是 parseInt

Answer 2

qty = $(".qty").val(),

那是在寻找一个 class 数量的元素，但您只有一个名称为 qty 的元素。您可以添加 class="qty" 或尝试使用 $("[name=qty]") 进行查找，这是一个慢得多的选择器。我建议查看 jquery 选择器

此外，我不太确定您要用 ajax 代码做什么。如果您只是尝试提交表单，$('form').submit() 可以。

如果您尝试 post，那么：

    $.ajax({
        url: 'cart.php',
        type: 'POST',
        data: { qty: qty }, // Data you want to submit
        success: function (data) {

            if (data === "ok") {                    
            }
        },
        error: function (e) {
        }
    });

jQuery Ajax 乘法

jQuery Ajax multiplication

html

ajax

jquery

multiplication