Jquery 异步跨域问题

回车提交异步请求

 $(function (){
    // 点击保存评论
    $(".reComment").on("click", function (){
        saveCommentData($(this).prev());
    });

    // 获取焦点情况下回车提交评论
    $(".reCommentInput").on("focus", function (){
        var _this = $(this);
        $(this).on('keyup', function (e) {
            e.stopPropagation();

            // 上下方向键
            if (e.keyCode == "38" || e.keyCode == "40"){
                console.log('你在动方向键');
            }

            // 回车
            if (e.keyCode == "13") {
                saveCommentData(_this);
            }
        });
    });
});

Ajax JSONP 跨域

/**
 * 保存评论内容
 * @param  _this
 */
function saveCommentData(_this)
{
    var content     = _this.val();
    var id          = _this.attr("data-id");

    // JSONP 不支持post跨域请求
    $.ajax({
        type: 'POST',
        jsonp: 'callback',
        dataType: 'jsonp',
        data:{id:id, content:content},
        url: "http://baidu.com/index.php",
        success: function (data) {
            console.log(data.id);
        }
    });                                                                                                                                                               }

getJSON 跨域

/**
 * 保存评论内容
 * @param  _this
 */
function saveCommentData(_this)
{
    var content     = _this.val();
    var id          = _this.attr("data-id");

    // getJson简单跨域请求
    $.getJSON("http://baidu.com/index.php?callback=?", {id:id, content:content}, function (date) {
        console.log(date);
    });
}

php 原生服务器端代码

public function saveReData(Request $request)
{
    $data = $_GET;
    return $_GET['callback'].'('.json_encode($data, JSON_UNESCAPED_UNICODE).')';
}

php Laravel框架务器端代码

public function saveReData(Request $request)
{
    $data = $request->all();
    return response()->jsonp(array_get($data, 'callback'), ['id'=>'ssssssssssssss']);
}
    原文作者:YPHP
    原文地址: https://segmentfault.com/a/1190000009461232
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞