$.getJSON()用法程式碼例項介紹

antzone發表於2017-04-08

本章節通過程式碼例項介紹一下$.getJSON()的用法,希望能夠給需要的朋友帶來一定的幫助。

下面首先介紹一下它的語法結構:

[JavaScript] 純文字檢視 複製程式碼
jQuery.getJSON(url,data,success(data,status,xhr))

引數解析:

(1).url:必需。規定將請求傳送到的URL。

(2).data:可選。規定連同請求傳送到伺服器的資料。

(3).success(data,status,xhr):可選。規定當請求成功時執行的函式。

        data:包含來自請求的結果資料。

        status:包含請求的狀態。

        xhr:XMLHttpRequest 物件。

其實此方法是對於$.ajax()的封裝,使用更為方便,相當於如下程式碼:

[JavaScript] 純文字檢視 複製程式碼
$.ajax({
  url: url,
  data: data,
  success: callback,
  dataType: json
});

程式碼例項如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function () {
  $("#bt").click(function () {
    var str = "<table>";
    $.getJSON("demo/ajax/net/jqueryAjax.ashx", function (json) {
      $.each(json, function (index, obj) {
        $.each(obj, function (y, data) {
          str = str + "<tr>";
          str = str + "<td>" + data["username"]
          + "</td><td>" + data["address"]
          + "</td><td>" + data["score"] + "</td>";
          str = str + "</tr>";
        })
      })
      str = str + "</tr></table>";
      $("#antzone").html(str);
    })
  })
})
</script>
</head>
<body>
<div id="antzone"></div>
<input type="button" id="bt" value="檢視效果"/>
</body>
</html>

上面的程式碼實現了我們的要求,可以將後臺資料讀取並以表哥的形式呈現。

$.getJSON()也可以實現跨域請求,具體可以參閱$.getJSON()實現跨域請求程式碼例項一章節。

後臺程式碼如下:

[C#] 純文字檢視 複製程式碼
namespace ajax
{
    /// <summary>
    /// jqueryAjax 的摘要說明
    /// </summary>
    public class jqueryAjax : IHttpHandler
    {
 
        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            DataSet ds = done();
            string jsonStr = GetJsonByDataset(ds);
            context.Response.Write(jsonStr);
        }
        private DataSet done()
        {
            string connString = ConfigurationManager.ConnectionStrings["access_con"].ConnectionString;
            string configPath = ConfigurationManager.ConnectionStrings["access_path"].ConnectionString;
            string conPath = HttpContext.Current.Server.MapPath(configPath);
            OleDbConnection conn = new OleDbConnection(connString + conPath);
 
            string sql = "select * from code";
            OleDbCommand cmd = new OleDbCommand(sql, conn);
            OleDbDataAdapter da = new OleDbDataAdapter(cmd);
            DataSet ds = new DataSet();
            da.Fill(ds, "ds");
            return ds;
        }
 
        private string GetJsonByDataset(DataSet ds)
        {
            if (ds == null || ds.Tables.Count <= 0 || ds.Tables[0].Rows.Count <= 0)
            {
                //如果查詢到的資料為空則返回標記ok:false
                return "{\"ok\":false}";
            }
            StringBuilder sb = new StringBuilder();
            sb.Append("{");
            foreach (DataTable dt in ds.Tables)
            {
                sb.Append(string.Format("\"{0}\":[", dt.TableName));
 
                foreach (DataRow dr in dt.Rows)
                {
                    sb.Append("{");
                    for (int i = 0; i < dr.Table.Columns.Count; i++)
                    {
                        sb.AppendFormat("\"{0}\":\"{1}\",", dr.Table.Columns[i].ColumnName.Replace("\"", "\\\"").Replace("\'", "\\\'"), ObjToStr(dr[i]).Replace("\"", "\\\"").Replace("\'", "\\\'")).Replace(Convert.ToString((char)13), "\\r\\n").Replace(Convert.ToString((char)10), "\\r\\n");
                    }
                    sb.Remove(sb.ToString().LastIndexOf(','), 1);
                    sb.Append("},");
                }
 
                sb.Remove(sb.ToString().LastIndexOf(','), 1);
                sb.Append("],");
            }
            sb.Remove(sb.ToString().LastIndexOf(','), 1);
            sb.Append("}");
            return sb.ToString();
        }
        private string ObjToStr(object ob)
        {
            if (ob == null)
            {
                return string.Empty;
            }
            else
                return ob.ToString();
        }
        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

相關文章