Ajax 请求 ES5,ES6,ES7的不同写法

 1<form class="form-aaa" method="post"></form><%ES6, 7%>
 2<form class="form-aaa" action="${path}/user/dologin" method="post"> <%ES5%>
 3    <h2 class="form-signin-heading">用户登录</h2>
 4    <label for="username" class="sr-only">用户名</label>
 5    <input type="text" id="username" name="name" class="form-control" placeholder="用户名" required autofocus>
 6    <br />
 7    <label for="inputPassword" class="sr-only">密码</label>
 8    <input type="password" id="inputPassword" name="pwd" class="form-control" placeholder="密码" required>
 9    <div class="checkbox">
10        <label>
11            <input type="checkbox" value="remember-me">
12            记住我 </label>
13    </div>
14    <input class="btn btn-lg btn-primary btn-block ajax-post" type="submit" value="登录" target-form="form-aaa">
15</form>

 1//dom加载完成后执行的js
 2$(function(){
 3    //ajax post submit请求
 4    $('.ajax-post').click(function(){
 5        var target,query,form;
 6        var target_form = $(this).attr('target-form');
 7        var that = this;
 8        if ($(this).attr('type')=='submit') {
 9            form = $('.'+target_form);
10            query = form.serialize();
11            target = form.get(0).action;
12            $.post(target, query, function(data) {
13                if (data.code === 200) {
14                    $.toast({
15                        heading: '操作成功',
16                        icon: 'success',//info, warning,error
17                        showHideTransition: 'slide',//fade,plain
18                        hideAfter: 2000,//ms
19                        position: 'top-center'
20                    });
21                    setTimeout(function(){
22                        if (data.info.url) {
23                            window.location.href= data.info.url;
24                        } else if( $(that).hasClass('no-refresh')){
25                            $(that).removeClass('disabled').prop('disabled',false);
26                        }else{
27                            location.reload();
28                        }
29                    },2300);
30                }else{
31                    $.toast({
32                        heading: '操作失败',
33                        text: data.info.info,
34                        icon: 'error',
35                        hideAfter: 2000,
36                        position: 'top-center'
37                    });
38                }
39            }, 'json');
40        }
41        return false;
42    });
43});

 1request.js
 2// 用promise对象封装
 3const request = (params) => {
 4    return new Promise((resolve, reject) => {
 5        $.ajax({
 6            url: params.url,
 7            type: params.type || 'get',
 8            dataType: 'json',
 9            headers: params.headers || {},
10            data: params.data || {},
11            success(res) {
12                resolve(res)
13            },
14            error(err) {
15                reject(err)
16            }
17        })
18    });
19};

 1$(function () {
 2    $('.ajax-post').click(function(){
 3        request({
 4            url:"${path}/user/dologin",
 5            type: 'post',
 6            data:$("#userForm").serialize()
 7        }).then(res => {
 8            if(res.code === 200){
 9                window.location.href= "${path}/user/main";
10            }else {
11                alert(res.info.info);
12                $.toast({
13                    heading: '操作失败',
14                    icon: 'error',
15                    hideAfter: 2000,//ms
16                    position: 'top-center'
17                });
18            }
19        });
20    });
21});

 1$(function () {    
 2    $('.ajax-post').on('click', clickHandler); 
 3    async function clickHandler() { 
 4        try { 
 5            const res = await request({ 
 6                url:"${path}/user/dologin", 
 7                type: 'post', 
 8                data:$("#userForm").serialize() }); 
 9            if(res.code === 200){ 
10                window.location.href= "${path}/user/main"; }
11            else { 
12                alert(res.info.info); } 
13        } 
14        catch(err) { 
15            console.log(err) 
16        } 
17    }
18});