jquery jsonp跨域请求

太过爱你忘了你带给我的痛 2022-08-23 05:38 232阅读 0赞

<form id="form" action="\#" method="post">    
   <ul>    
    <li><label>标题：</label><input type="text" class="input\_text" name="title" /></li>    
    <li><label>内容：</label><input type="text" class="input\_text" name="content" /></li>    
    <li><input type="submit" class="btn" value="提 交" /></li>    
   </ul>    
</form>    
<div id="rs" style="display:"></div>  
<script>  
       $(function() \{  
        $("\#form").submit(function() \{  
        var data = $(this).serialize(); //表单数据系列化  把表单数据转换成&a=1&b=2形式  
        alert(data)  
        $.getJSON("http://www.artv.cn/artv/index/callback?callback=?", data, //把表单参数拼接到地址上，获得回调数据，  
        function(json) \{  
            var message = '';  
            if (json.status == 1) \{  
  
                message = "<strong>返回信息:</strong><p>标题：" + json.title + "</p>内容：" + json.content + "</p>内容：" + json.status + ""  
            \} else \{  
                message = "请注意返回json格式！";  
            \}  
            $("\#rs").html(message);  
        \});  
        return false;  
    \});  
\});

</script>

服务端代码

$result['title'] = $_GET['title'];  
    $result['content'] = $_GET['content'];   
    echo $_GET['callback'].'('.json_encode($result).')';

jsonp跨域请求，返回的是一个javascript函数，客户端解析script标签，里面带上了我们的请求返回的数据，解析数据

首先在客户端注册一个callback (如:'jsoncallback'), 然后把callback的名字(如:jsonp1236827957501)传给服务器。

此时，服务器先生成 json 数据。然后以 javascript 语法的方式，生成一个function , function 名字就是传递上来的参数 'jsoncallback'的值 jsonp1236827957501 .

最后将 json 数据直接以入参的方式，放置到 function 中，这样就生成了一段 js 语法的文档，返回给客户端。

客户端浏览器，解析script标签，并执行返回的 javascript 文档，此时javascript文档数据,作为参数，传入到了客户端预先定义好的 callback 函数。

$('checkbox').eq(0).checked.each() //遍历选中的checkbox