原生js封装jsonp函数

怎么才可以让返回成功的函数:success写到它的参数内部,

function success(data){
    console.log(data);
}
jsonp({
    url:'https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',
    type:'get',
    data:{
        wd:'jsonp'
    },
    callback :'cb',
    success:success
});
function jsonp(options){
    var url = options.url;
    var data = options.data;

    format(data,options,function(str,callback){
        var oBody = document.getElementsByTagName('body')[0];
        var oScript = document.createElement('script');
        oScript.setAttribute('src',url+'?'+str + options.callback+'='+callback);
        oBody.appendChild(oScript);
    });
    return options.success;

};
function format(data,options,callback){
    var callbackName = '';
    var str = '';
    for(var p in data){//格式化get提交的参数
        str += p+'='+data[p]+'&';
    }
    for(var p in options){
        if(options[p] == options.success){//取出要返回的函数名
            callbackName = p;
            callback && callback(str,callbackName);
        }
    }
}

如果是这么写success:function(data){conosle.log(data);}

会报一个success is undefined错误

阅读 4.9k
1 个回答

https://jsfiddle.net/hsfzxjy/...

jsonp({
    url: 'https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',
    type: 'get',
    data:{
        wd: 'jsonp'
    },
    callback: 'cb',
    success: function (data) { console.log(data) }
});

function jsonp (options) {
    let url = options.url
    let data = options.data
    
    let oBody = document.getElementsByTagName('body')[0]
    let oScript = document.createElement('script')
    
    let callbackName = 'cb' + (~~(Math.random()*0xffffff)).toString(16)
    window[callbackName] = function (result) {
        options.success(result)        
    }
    data[options.callback] = callbackName
    
    oScript
        .setAttribute('src', url + '?' + format(data))
    oBody.append(oScript)
}
function format(data) {
    let str = ''
    for (var p in data) {
        str += encodeURIComponent(p) + '=' + encodeURIComponent(data[p]) + '&'
    }
    return str
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题