实现Ajax跨域请求的jsonp代码
时间: 2023-10-26 20:15:32 浏览: 69
jsonp是一种利用script标签来实现跨域请求的技术。
下面是一个简单的示例:
```javascript
function jsonp(url, callback) {
var script = document.createElement('script');
script.src = url + '&callback=' + callback;
document.body.appendChild(script);
}
// 使用示例
jsonp('http://example.com/data', 'handleData');
function handleData(data) {
// 处理返回的数据
}
```
上面的代码中,`jsonp`函数接受两个参数,分别是请求的URL和回调函数的名称。在函数内部,我们创建了一个新的`<script>`标签,并将其`src`属性设置为请求的URL加上回调函数名称。然后,将`<script>`标签添加到页面的`<body>`元素中。
服务器返回的数据应该包含一个函数调用,并将数据作为参数传递给该函数。例如,如果服务器返回以下数据:
```javascript
handleData({ name: 'John', age: 25 });
```
那么,`jsonp`函数将会动态创建以下代码:
```html
<script src="http://example.com/data&callback=handleData"></script>
```
当浏览器加载该脚本时,`handleData`函数将被调用,并将数据作为参数传递进去。我们只需在代码中定义`handleData`函数来处理返回的数据。
阅读全文