javascript - 如何使用 ajax 和 jquery 计算折扣价值和汇款并在网站上显示

Question

嗨，我已经与这个问题作斗争超过 3 天了。我会尝试解释我想做什么。

输入折扣码
检查有效性代码
检查值是否是值的百分比
使用 Ajax 回馈价值
计算最终价格（正常价格 - 折扣 + moneytransercosts）
在页面中显示价格

凭证1：stackoverflow1250 => 12,50
凭证2：stackoverflow50 => 50%
示例：http ://www.gitaartabs.nl/aanmelden.html?ref=plus&discount

aanmelden.html 页面上的 Javascript

// Select subscription (Dutch -> abonnement)
// Globals
        var discount_value; 
        var discount_value_amount; 
        var abonnement; 
        var moneytransfer; 
        var totalprice;
        var displayprice = totalprice;

$(document).ready(function(){
$("#username").change(function() {
        var usr = $("#username").val();
        if(usr.length >= 4)
        {
        $("#status").html('<img src="js/username_checker/loader.gif" align="absmiddle">&nbsp;Checking availability...');
            $.ajax({
            type: "POST",
            url: "js/username_checker/check.php",
            data: "username="+ usr,
            success: function(msg){
                $("#status").ajaxComplete(function(event, request, settings){
                    if(msg == 'OK')
                    {
                        $("#username").removeClass('object_error'); // if necessary
                        $("#username").addClass("object_ok");
                        $(this).html('&nbsp;<img src="js/username_checker/tick.gif" align="absmiddle">');
                    }
                    else
                    {
                        $("#username").removeClass('object_ok'); // if necessary
                        $("#username").addClass("object_error");
                        $(this).html(msg);
                    }
                });
            }
          });
        }
        else{
            $("#status").html('<font color="red">&nbsp;Minimum <strong>4</strong> characters.</font>');
            $("#username").removeClass('object_ok'); // if necessary
            $("#username").addClass("object_error");
        }
    }); 

$("#discountcodeid").change(function() {
        var discountcodeid = $("#discountcodeid").val();
        var discount_value = discount.val;
        $("#discount").html('<img src="js/username_checker/loader.gif" align="absmiddle">&nbsp;Coupon valideren ...');
            $.ajax({
            type: "POST",
            url: "classes/discountcheck.php",
            data: "discountcodeid="+ discountcodeid, 
            success: function(msg){
                $("#discount").ajaxComplete(function(event, request, settings){
                    if(msg == 'OK')
                    {
                        $("#discountcodeid").removeClass('object_error'); // if necessary
                        $("#discountcodeid").addClass("object_ok");
                        $(this).html('&nbsp;<img src="js/username_checker/tick.gif" align="absmiddle">');
                    }
                    else
                    {
                        $("#discountcodeid").removeClass('object_ok'); // if necessary
                        $("#discountcodeid").addClass("object_error");
                        $(this).html(msg);
                    }
                });
            }
          });
    alert ("Gefeliciteerd je krijgt " + discount + " euro korting"); 
    }); 
}); //end document.ready function

function selectAbonnement(id)
{
    $("#type-abonnement-" + id).attr("checked", true);
    if (id == 1) { //gratis
        $("#paymentOptions").hide('fast');
        $("#discountcode").hide('fast');
        $("#adres").hide('fast');
        $("#naam").hide('fast');
        $("#aanmeldengtplus").hide('fast');
        $("#aanmeldengtgratis").show('fast');
        $("#instrument").show('fast');
        $("#invoiceamount").hide('fast');
        $("#paymentlogos").hide('fast');
        $("#displayprice").hide('fast');

    } else { //betaald
        $("#paymentOptions").show('fast');
        $("#discountcode").show('fast');
        $("#adres").show('fast');
        $("#naam").show('fast');
        $("#aanmeldengtplus").show('fast');
        $("#aanmeldengtgratis").hide('fast');
        $("#instrument").hide('fast');
        $("#invoiceamount").show('fast');
        $("#paymentlogos").show('fast');
        $("#displayprice").show('fast');
        $("#inloggen").hide('fast');


        if (id == 2) { // 1mnd abonnement
            $("#invoiceamount2").show('fast');
            $("#invoiceamount3").hide('fast');
            $("#invoiceamount4").hide('fast');
            this.abonnement=24.95;
        }
        if (id == 3) { // 3mnd abonnement
            $("#invoiceamount3").show('fast');
            $("#invoiceamount2").hide('fast');
            $("#invoiceamount4").hide('fast');
            this.abonnement=62.50;
        }
        if (id == 4) { // 6mnd abonnement
            $("#invoiceamount4").show('fast');
            $("#invoiceamount2").hide('fast');
            $("#invoiceamount3").hide('fast');
            this.abonnement=99.50;
        }
    }
}

function paymentChange(payment)
{
    if (payment == 'ideal') {
        $("#paymentIdeal").show('fast');
        $("#paymentPaypal").hide('fast');
        $("#paymentMoneytransfer").hide('fast');
        this.moneytransfer = 0;
    } else if (payment == 'paypal') {
        $("#paymentIdeal").hide('fast');
        $("#paymentPaypal").show('fast');
        $("#paymentMoneytransfer").hide('fast');
        moneytransfer = 0;
    } else if (payment == 'moneytransfer') {
        $("#paymentIdeal").hide('fast');
        $("#paymentPaypal").hide('fast');
        $("#paymentMoneytransfer").show('fast');
        this.moneytransfer = 2.50;

        // CALCULATION OF TOTAL PRICE
        this.totalprice = this.abonnement;

        if(discount_value > 0){ // KORTINGPERCENTAGE
        totalprice = abonnement + moneytransfer - (abonnement * (discount_value/100));
        }
        else if (discount_value_amount > 0){ // WAARDE KORTING
        totalprice = abonnement + moneytransfere - discount_value_amount;
        }
        else{
        totalprice = abonnement + moneytransfer ;
        }
        alert ("De Totaalprijs wordt (ivm administratiekosten)  " + totalprice + " Euro.");

    }
}


//-->
</script>

在哪里放置总价

<div id="invoiceamount2" style="display:none;">
    <br />
    Product: <span class="priceproduct">1 maand Gitaartabs Plus</span><br /><br />
    <span class="pricevoor">Totaalbedrag: &euro; <span id="totalprice">24,95</span></span><br>
</div>
<div id="invoiceamount3" style="display:none;">
    <br />
    Product: <span class="priceproduct">3 maanden Gitaartabs Plus</span><br /><br />
    <span class="pricevoor">Totaalbedrag:  &euro; <span id="totalprice">62,50</span></span>
     <span class="pricevan">(Normaal &euro; 74,85</span>)<br>
    <span class="pricebesparing">Je bespaart &euro; 12,35! (15% korting)</span>
</div>
<div id="invoiceamount4" style="display:none;">
    <br />
    Product: <span class="priceproduct">3 maanden Gitaartabs Plus</span><br /><br />
    <span class="pricevoor">Totaalbedrag: &euro; <span id="totalprice">99,50</span></span>
    <span class="pricevan">(Normaal &euro; 149,70</span>)<br>
    <span class="pricebesparing">Je bespaart &euro; 50,20!  (32% korting)</span>
</div>
<br />
<hr>    
    <h2>De volgende stap - Betaling (payment)</h2>
<hr>    
<div id=betaling> <? /* IF TOTAL = 0 { GRATIS } */ ?>
<div>
    <br />
    <label><input type="radio" name="paymentname" value="ideal" checked="checked" onchange="paymentChange('ideal');">iDeal</label>
    <label><input type="radio" name="paymentname" value="paypal" onchange="paymentChange('paypal');">PayPal</label>
    <label><input type="radio" name="paymentname" value="moneytransfer" onchange="paymentChange('moneytransfer');">Overboeking (+ &euro; 2,<sup>50</sup>)</label>
    <br /><br />
</div>

check.php 会返回这个。

    $row = mysql_fetch_assoc($sql_check);
    $discount_value = $row['discount_value'];
    $discount_value_amount = $row['discount_value_amount'];

    if(mysql_num_rows($sql_check))
    { 
        if($discount_value > 0 )
        {
            // discount is percentage (10%)
            echo $discount_value;
        }
        else if($discount_value_amount > 0 )
        {
            // discount is value (24,95)
            echo $discount_value_amount; 

        }
    }
    else
    {
    echo "&nbsp;<font color=\"red\">To bad this code is not correct.</font>";
    }

我真的希望这样可以帮助我打破这个难题:) 最好的问候和非常感谢！

简

javascript - 如何使用 ajax 和 jquery 计算折扣价值和汇款并在网站上显示

0 回答 0

Related

Reference