Question

我确定我在这里忽略了一些东西......我有一些jQuery代码在按下表单按钮时会触发。按下按钮，查找优惠券代码并在表格上的div中写入，然后应用折扣（总计=价格 - 折扣）。问题是，当我通过Firebug进行调试时，代码工作的大约80％的时间。但是，当我运行代码时，它不起作用。这就像代码运行得太快，变量无法获得正确的信息。这是代码：

$('#coupon-submit').click(function() {
    applyCoupon($('#coupon'), $(this));

    var price = $('#price-total').text();
    price = price.substring(5,price.length);

    var theText = $('#fulldiscounttext').text();  // Sometimes this has a value while debugging, sometimes not
    var discount = theText.substring(1, theText.length-4); // Takes unwanted characters out of string

    var total = price - discount;

    $('#price-total').text('US $ ' + total.toFixed(2));
    var thetotal = $('#price-total').text();
    $('#grandtotal').val(thetotal);
});

applyCoupon()查找代码并将其写入div #fulldiscounttext。我试图以折扣金额进行#price-total div更新。它没有更新（除非我调试它）。

applyCoupon（）函数：

function applyCoupon(couponInput, couponButton)
{
    removeInputNames();
    $.ajax({
        data: $('#orderform').serialize(),
        type: 'POST',
        timeout: 5000,
        url: 'coupon.php',
        dataType: 'text',

        beforeSend: function(request)
        {
            $('#coupon-error').text('');
            couponButton.attr('disabled', 'disabled');

        },
        success: function(data, textStatus)
        {
            couponButton.removeAttr('disabled');

            if(data == "bad error code")
                couponOK = 0;
            else
                couponOK = 1;

            if (!couponOK)
            {
                var badcode = couponInput.val().toString();
                if (badcode.length > 0)
                {
                    var fmt = 'You\'ve entered an invalid code.';
                    $('#coupon-error').text(fmt);
                }
            }
            else    // Coupon recognized!
            {
                $('#total-row').before('<tr><td colspan="4">'
                    + '<div id="fulldiscounttext">' + data
                    + ' Off</div>'
                    + '</td></tr>');

                // New discount information; save and update totals
                $('#discount-storage').text(data);
                showPrice();
            }
        }
    });
}

Answer 1

由于applyCoupon是异步函数，因此其余代码将在请求进程时继续运行。在调用完成后使用回调来运行代码：

applyCoupon($('#coupon'), $(this), function() {
    var price = $('#price-total').text();
    price = price.substring(5,price.length);

    var theText = $('#fulldiscounttext').text();  // Sometimes this has a value while debugging, sometimes not
    var discount = theText.substring(1, theText.length-4); // Takes unwanted characters out of string

    var total = price - discount;

    $('#price-total').text('US $ ' + total.toFixed(2));
    var thetotal = $('#price-total').text();
    $('#grandtotal').val(thetotal);
});

applyCoupon函数：

function applyCoupon(couponInput, couponButton, callback) {
    //AJAXy stuff
    success: function(data, textStatus)
    {
        couponButton.removeAttr('disabled');

        if(data == "bad error code")
            couponOK = 0;
        else
            couponOK = 1;

        if (!couponOK)
        {
            var badcode = couponInput.val().toString();
            if (badcode.length > 0)
            {
                var fmt = 'You\'ve entered an invalid code.';
                $('#coupon-error').text(fmt);
            }
        }
        else    // Coupon recognized!
        {
            $('#total-row').before('<tr><td colspan="4">'
                + '<div id="fulldiscounttext">' + data
                + ' Off</div>'
                + '</td></tr>');

            // New discount information; save and update totals
            $('#discount-storage').text(data);
            showPrice();
        }
        callback(); //ADDED CALLBACK TO RUN ONCE THE AJAX REQUEST IS COMPLETE
    }
}

jQuery代码不更新网页

1 个答案: