$.getJSON(url,null,function call(data){});

canry Tong — Mon, 26 Mar 2012 02:47:00 GMT

今天使用$.getJSON(url,null,function call(data){});获取数据：

  前台js代码：
<script type="text/javascript">
//
function convertUrl(url){
    var timestamp = (new Date()).valueOf();
    if(url.indexOf("?")>=0){
        url = url+"&t="+timestamp;
    }else{
        url = url+"?t="+timestamp;
    }
    return url;
}

$(function(){
    var newUrl01 = "/html/school/schoolTJSchoolWeb.do?sch_hot=3";
    $.getJSON(convertUrl(newUrl01),null,function call(data){
        var myTitle="";
        for(var i=0; i<$(data).length-1 ;i++){
            var otherObj = $(data).get(i+1);
            if(otherObj.sch_name.length>21){
            myTitle +=""+otherObj.sch_id+"'>"+otherObj.sch_name.substring(0,21)+'..'+"";
            }else{
            myTitle +=""+otherObj.sch_id+"'>"+otherObj.sch_name+"";
            }
        }
        $("#school_ul01").html(myTitle);
    });

    var newUrl = "/html/school/adSchoolWeb.do";
    $.getJSON(convertUrl(newUrl),null,function call(data){
        var myTitle="";
        for(var i=0; i<$(data).length ;i++){
            var otherObj = $(data).get(i);
            myTitle +="

"+otherObj.AD_FILE_PATH+"' alt='广告' />

";
        }
        $("#ad_ul").html(myTitle);
    });
});
         //]]>
script>

  前台jsp代码：

<html>
<head>
<title>title>
head>
<body>
<div>
  <ul id="school_ul01">
    <li>li>
  ul>
  <ul id="ad_ul">
    <li>li>
  ul>
div>
body>
html>

  后台java代码：

    public void  schoolTJ() throws Exception{
        HttpServletResponse response = ServletActionContext.getResponse();
        HttpServletRequest request = ServletActionContext.getRequest();
        String sch_hot = request.getParameter("sch_hot");
        List<DragonSchool> schoolList = (List<DragonSchool>) this.webDragonSchoolService.list("select * from dragon_school where SCH_HOT ='"+sch_hot+"' limit 0,10", DragonSchool.class);
        Gson gson = new Gson();
        String schoolListToJson = gson.toJson(schoolList);
        response.setCharacterEncoding("utf-8");
        response.getWriter().write(schoolListToJson);
        response.getWriter().close();
    }

    public void ad() throws Exception{
        HttpServletResponse response = ServletActionContext.getResponse();
        List adList = webDragonAdvertisingService.webList(pager, "4", null, 9);
        Gson gson = new Gson();
        String adListToJson = gson.toJson(adList);
        response.setCharacterEncoding("utf-8");
        response.getWriter().write(adListToJson);
        response.getWriter().close();
    }

canry Tong 2012-03-26 10:47 发表评论

$.get(url,function call(data){});

canry Tong — Fri, 23 Mar 2012 06:13:00 GMT

问题出现：
    今天做项目遇到这样的需求，每个页面header部分和body部分之间要有3张图片，中间部分的图片是静态的，而左右两侧需要从数据库动态查出，即广告位；
开始的思路：
    如果单纯的是一个页面还好说，思路是在请求Action时，在相应方法中加入数据库查询方法，响应后接到list显示图片即可；
难题的出现：
    但现在的情况是，有多个jsp页面需要接收这个list，也就是说，按原来的思路，首先需要将该部分做成公共jsp页面，使用<%@ include file="/include/advertising.jsp" %>进行包含使用，其次在所有涉及该广告显示的jsp页面链接请求的Action中加入数据库查询方法；
    想想这个工作量有多大，而且在团队合作开发的今天，我在别人完成的代码的基础上加入某些代码，稍不留意就会有遗漏，导致项目出现问题！
最终的解决方案(最好的)
    怎么办呢？Ajax！！神奇的Ajax！！对我来说Ajax显得很陌生，即便做了半年多的web开发，即便Ajax在web开发中应用很广泛，到了今天我才真正认识到Ajax的力量！贴代码吧，见证“我的Ajax”：

公共页面advertising.jsp代码：

<%@ page contentType="text/html; charset=utf-8" language="java" errorPage="" %>
<script type="text/javascript">
//
$(function(){
        var url1 = "/getAdAdvertisingAction.do";
        $.get(url1,function call(data){
                var array = data.split(",");
                document.getElementById("left_ad01").src = array[0];
                document.getElementById("left_ad02").src = array[1];
        });
    });
//]]>
script>

<ul id="banner">
    <li class="ml_0"><img id="left_ad01" width="173" height="90" src="/images/banner/img01_banner.png" alt="广告" />li>
    <li><img src="/images/banner/img02_banner.png" alt="广告" />li>
    <li><img id="left_ad02" width="173" height="90" src="/images/banner/img03_banner.png" alt="广告"  />li>

ul>

引用页main.jsp代码(多个页面引用，这里以main.jsp为例)：

<%@ page contentType="text/html; charset=utf-8" language="java" errorPage="" %>
<html>
<title>title>
<head>head>
<body>
<%@ include file="/include/header.jsp" %>
<%@ include file="/include/advertising.jsp" %>
<div>div>
<%@ include file="/include/footer.jsp" %>
boday>
html>

后台Action.java代码：

public void getAd() throws Exception {
        HttpServletResponse response = ServletActionContext.getResponse();
        List<DragonAdvertising> adList = dragonAdvertisingService.webList(pager, "1", "1", 1);
        List<DragonAdvertising> adList1 = dragonAdvertisingService.webList(pager, "1", "2", 1);
        response.getWriter().write("/"+adList.get(0).getAD_FILE_PATH()+","+"/"+adList1.get(0).getAD_FILE_PATH());
        response.getWriter().close();
    }

就是这样，所有想似复杂和看似复杂的问题就这样解决了；
当然，Ajax的应用远没有这样简单，还有很多复杂的方法和原理我还没有见过，慢慢学习吧！

canry Tong 2012-03-23 14:13 发表评论

BlogJava-canry Tong-文章分类-Ajax简单应用

$.getJSON(url,null,function call(data){});

$.get(url,function call(data){});