JasonDurian
3/23/2018 - 6:23 AM

A general jquery ajax component

首先运用在 https://www.ebiomall.com/htdeng 后台的,通用ajax提交form表单的组件。提示弹窗等使用layer。

// 标识上一次ajax 请求有没回来, 没有回来不再进行下一次
var before_request = 1;

/**
 * ajax 提交表单
 */
function ajax_submit_form(form_id, submit_url, callback) {

    if(before_request == 0)
        return false;

    var form_data = !!form_id ? new FormData(document.getElementById(form_id)) : new FormData();

    // ajax mark
    form_data.append('is_ajax', 1);

    $.ajax({
        type: 'POST',
        url: submit_url,
        data: form_data,
        // async: false,
        cache: false,
        processData: false,
        contentType: false,
        error: function (request) {
            layer.alert('服务器繁忙, 请联系管理员!');
        },
        success: function (res) {

            before_request = 1; // 标识ajax 请求已经返回

            var v = eval('(' + res + ')');
            // 验证成功提交表单
            if (v.hasOwnProperty('status')) {

                v.status = parseInt(v.status, 10);

                // 存在返回的提示消息并且不为空
                v.hasOwnProperty('message') && !!v.message && layer.msg(v.message, {
                    icon: v.status === 0 ? 1 : 2,   // 图标
                    time: 2000 // 2秒关闭(如果不配置,默认是3秒)
                });

                // redirect参数是为了返回错误状态时,也进行页面跳转
                if (v.status === 0 || (v.hasOwnProperty('redirect') && v.redirect)) {
                    // ajax执行成功后的逻辑
                    setTimeout(function () {
                        if (v.hasOwnProperty('data')) {
                            // 1. 后台返回了data数组,即说明需要页面跳转
                            if (v.data.length > 1) {
                                // 改写 如果有多个链接的话 返回弹出框让用户选择 20180125 Jason
                                var btnArr = [];
                                var confirmObj = {};
                                for (var j in v.data) {
                                    if (v.data.hasOwnProperty(j)) {
                                        j = parseInt(j, 10);
                                        var objKey = 'btn' + (j + 1);
                                        btnArr.push(v['data'][j]['text']);

                                        // 循环定义函数或者使用函数的话,需要使用此种方式
                                        // creating a new closure that captures the value of the variable
                                        confirmObj[objKey] = (function (inner_target) {
                                            return function () {
                                                location.href = inner_target;
                                                return false;
                                            }
                                        }(v['data'][j]['href']));
                                    }
                                }
                                confirmObj.btn = btnArr;

                                layer.confirm('请选择一个返回的链接', confirmObj);

                            }
                            else {
                                location.href = v['data'][0]['href'];
                            }
                        }

                        if (v.hasOwnProperty('content')) {
                            // 2. 后台有返回除了跳转链接外的数据的话,返回后台传递过来的整个对象,不做页面跳转
                            // 如需使用后台数据的话,不能够直接返回,需要特殊处理,例如在函数中使用
                            !!callback && callback(v);
                        }

                        if (!v.hasOwnProperty('data') && !v.hasOwnProperty('content')) {
                            // 3. 后台什么都没有返回的话刷新页面
                            location.href = location.href;
                        }
                    }, v.hasOwnProperty('message') && !!v.message ? 1500 : 100);

                    return true;
                }
                else {
                    !!callback && callback(v);
                    return false;
                }
            }
            else {
                !!callback && callback(v);
            }
        }
    });

    before_request = 0; // 标识ajax 请求已经发出
}

/**
 * 删除后异步更新报价篮(示例)
 *
 * @param result
 */
function set_cart_content(result) {
    var cartInfo = $('.ECS_CARTINFO');

    cartInfo && cartInfo.html(result.content);
}

/**
 * 将商品从报价篮中删除(示例)
 *
 * @param rec_id
 * @param form_id
 */
function delete_cart_goods(rec_id, form_id) {
    confirm('确定删除此商品?', function(res){
        res && ajax_submit_form(form_id, 'delete_cart_goods.php?id=' + parseInt(rec_id, 10), set_cart_content);
    })
}