ajax 访问服务器

来源：互联网发布：ios版nba2k17捏脸数据编辑：程序博客网时间：2024/06/08 08:07

1.html代码
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <title>hello world</title>
        <script type="text/javascript" src="js/jquery-1.6.4.min.js"></script>
        <script type="text/javascript">
            function pullNoticeList() {
                   var url_long = $("#url_long").val();
                    var source = $("#source").val();
                    var request = "http://172.16.32.137:8080/buslines/hytc/adminAction_select.action?page="
                    + url_long + "&rows=" + source + "&jsoncallback=?";
                    //&callback=? 必须加上，虽然可以返回数据但success：function 不会调用。jquery api 文档上有说明。
                    $.ajax({
                        dataType: "jsonp", //跨域访问 dataType 必须是jsonp 类型。
                        url: request,
                        type: "GET",
//                         jsonp: "callbackparam",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
//                       jsonpCallback:"jsoncallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
                        success: function(data) {
                            var id="";
                            var name="";
                            var value="";
                            for(var i=0;i<data.rows.length;i++){
                                var $row=data.rows[i];
                                 value+=$row.id+","+$row.name;
                                  }
                            $("#shortUrl").html("服务器端的数据是：" +value+"<br/>");
                        },
                        error: function(XMLHttpRequest, textStatus, errorThrown) {
                            alert("status" + XMLHttpRequest.status);
                            alert("readyState" + XMLHttpRequest.readyState);
                            alert("textstatus" + textStatus);
                            alert(errorThrown);
                        }
                    });
                    return false;
                }
        </script>
    </head>

    <body>
        <div>
            <form>
                page：<input type="string" name="url_long" id="url_long" />
                <br/>
                rows<input type="string" name="source" id="source" />
                <br/>
                <input type="button" name="submit" value="提交" onclick="pullNoticeList()" />
            </form>
        </div>
        <div id="shortUrl">
        </div>
    </body>

</html>

2.访问结果
注：page 是指第几页，rows是指访问多少数据

3.中间运行的时候出现了一个问题：

原因是跨域访问，web端配置struts时要加上：

0 0