时间戳

首页 > 解决方案 > url中存在折扣券时如何自动发送？

php - url中存在折扣券时如何自动发送？

问题描述

我创建了一个折扣券系统，一切正常。

从下面的表格中，我通过 ajax 发送信息

<div class="form-group relative">
    <div class="response">
        <div class="success"></div>
        <div class="warning"></div>
    </div>
    <form id="coupon" class="mt-2em" method="post" autocomplete="off" enctype="multipart/form-data">
        <div class="form-group flex justify-between">
            <div class="promo">
                <input type="text" name="couponCode" maxlength="15" placeholder="Enter the coupon">
            </div>
            <div class="btn-promo">
                <input id="submit_coupon" type="submit" name="ajaxData" value="Apply" formnovalidate>
            </div>
        </div>
    </form>
</div>

而且，这是我的 ajax 代码

$(function() {
    var frm = $('#coupon');
    frm.submit(function(e){
        e.preventDefault();
        var formData = frm.serialize();
        formData += '&' + $('#submit_coupon').attr('name') + '=' + $('#submit_coupon').attr('value');
        
        var url = "coupon.php";
        $.ajax({
            type: frm.attr('method'),
            url: url,
            data: formData,
        })
        .done(function(data) {

            let res = JSON.parse(data);
            if(res.status){
                $(".checkout").load(" .checkout").fadeIn();
                $(frm)[0].reset();
                $(frm).hide();
            } else {
                if (typeof (res.message) === 'object') {
                    for (let name in res.message) {
                        $('.error').remove();
                        let msg = '<span class="error">' + res.message[name] + '</span>';
                        $(msg).insertAfter($('[name=' + name + ']', '#coupon'));
                        $('.error').fadeIn().delay(5000).fadeOut(5000);
                    }
                } else {
                    $('.warning').fadeIn();
                    $('.warning').html(res.message).delay(8000).fadeOut(8000);
                }
            }
        })
        .fail(function( jqXHR, textStatus ) {
            console.log(jqXHR.responseText);
            console.log("Request failed: " + textStatus );
        })
    });
});

我怎么提这个好，但是使用相同的ajax代码，如何在通过URL共享优惠券时自动发送优惠券代码？

也就是说，如果我在 url 中有以下内容：example.com/?codecoupon=EADEAA所以我想仅当 URL 中有这些参数时才自动将该信息发送到 Ajax。

标签： phpjqueryajax

解决方案

在您的 HTML 中：

<input type="text" name="couponCode" maxlength="15" placeholder="Enter the coupon" value="<?= isset($_GET['codecoupon']) ? $_GET['codecoupon'] : '' ?>">

（为了避免 XSS 注入，你想用 包装它htmlspecialchars）

在您的 JS 中，您应该使发送代码成为一个函数，然后调用它：

  1. 提交时
  2. 加载时：仅当输入不为空时。

该脚本将如下所示：

$(function() {
    var frm = $('#coupon');
    
    frm.submit(function(e){
        e.preventDefault();
        sendCoupon(frm);
    });
    
    if ($("input[name='couponCode']").val() !== "") {
        sendCoupon(frm);
    }
    
    function sendCoupon(frm) {
        var formData = frm.serialize();
        formData += '&' + $('#submit_coupon').attr('name') + '=' + $('#submit_coupon').attr('value');
        
        var url = "coupon.php";
        $.ajax({
            type: frm.attr('method'),
            url: url,
            data: formData,
        })
        .done(function(data) {

            let res = JSON.parse(data);
            if(res.status){
                $(".checkout").load(" .checkout").fadeIn();
                $(frm)[0].reset();
                $(frm).hide();
            } else {
                if (typeof (res.message) === 'object') {
                    for (let name in res.message) {
                        $('.error').remove();
                        let msg = '<span class="error">' + res.message[name] + '</span>';
                        $(msg).insertAfter($('[name=' + name + ']', '#coupon'));
                        $('.error').fadeIn().delay(5000).fadeOut(5000);
                    }
                } else {
                    $('.warning').fadeIn();
                    $('.warning').html(res.message).delay(8000).fadeOut(8000);
                }
            }
        })
        .fail(function( jqXHR, textStatus ) {
            console.log(jqXHR.responseText);
            console.log("Request failed: " + textStatus );
        });
    }
});

推荐阅读