Jquery 之Ajax方法$.get() 的运用，扩展链接模型的天地

如前文说道的那个表现层和业务层的链接模型，从上篇博文（http://www.cnblogs.com/AflutterFeather/archive/2010/01/07/1641315.html）中可以看到：我们通过WebService提供的方法来获取服务端的返回值。

如果不采用WebService，有其他的方法来同服务端代码进行交互吗？

经过研究，终于实验通过，现在就$.get()方法来进行讲解。

$.get(url [,data] [,callback] [,type]) -- 方法的完整定义

第一：从服务端获取字符串

第二：根据传入的参数，自动执行服务端的不同方法，返回字符串

第三：从服务端获取Json格式的数据

环境：

静态页面：get1.htm

服务端页面: get1.aspx

服务端返回Json格式的组件：System.Web.Extensions.dll

1） get1.htm代码（暂时不含js代码）

运行页面》》》

代码

2）get1.htm代码(js代码）

代码

$(function(){
$("#send").click(function(){
$.get("get1.aspx",

{ username :  $("#username").val() , content :   $("#content").val()  },
             function (data, textStatus){
                if(textStatus)
                {
                    $("#resText").html(data);
                 }//if
             }//function (data, textStatus

);//$.get

})
})

3）JS代码说明：

$("#username").val() -- 获取控件中填入的值

{ username : $("#username").val() , content : $("#content").val()｝ -- data输入参数格式

textStatus -- 返回的状态值，bool类型的值

$("#resText").html(data); -- 从get1.aspx返回的值插入到div里面去

4)get1.aspx代码说明

只有一行代码

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="get1.aspx.cs" Inherits="get1" %>

5）get1.cs 代码说明

代码

protected void Page_Load(object sender, EventArgs e)
{
        string k1 = "";
        string k2 = "";

        if (Request.QueryString["username"] != null)
        {
            k1 = Request.QueryString["username"].ToString();
        }
        if (Request.QueryString["content"] != null)
        {
            k2 = Request.QueryString["content"].ToString();
        }

Response.Write(GetInfo1(k1, k2));

}

private string GetInfo1(string username, string content)
{
return "I>>"+username + ">>" + content;
}

总结：当点击get1.htm的提交按钮的时候，将值传入服务端get1.aspx，经过处理后，通过回写出字符串。

》》》》》》》》》》》》》》》

进行扩展思维--------------------》

扩展1

不通过webservice，我们就可以与服务端进行交互，这个时候我们让其根据传入的参数类型来执行不同的方法，这样我们就可以把很多方法都写在一个集中的页面里面（Facade模式），以便于集中管理

$.get("../get1.aspx?type=1", -- 加了一个传入类型

.cs代码的变化

代码

protected void Page_Load(object sender, EventArgs e)
{
        string k1 = "";
        string k2 = "";
        string strType = "";
        if (Request.QueryString["username"] != null)
        {
            k1 = Request.QueryString["username"].ToString();
        }
        if (Request.QueryString["content"] != null)
        {
            k2 = Request.QueryString["content"].ToString();
        }
        if (Request.QueryString["type"] != null)
        {
            strType = Request.QueryString["type"].ToString();
        }

if (strType == "1")
        {
            Response.Write(GetInfo1(k1, k2));
        }
        else if (strType == "2")
        {
            Response.Write(GetInfo2(k1, k2));
        }
}

private string GetInfo1(string username, string content)
    {
        return "I>>"+username + ">>" + content;
    }

private string GetInfo2(string username, string content)
    {
        return "II>"+username + ">>" + content;
    }

扩展2

以上都是返回一个字符串，在cs页面调用Response.write方法进行写入。这对于单个返回值是没有问题的，但如果我们要返回一个对象的值？总不能采用这种方法，用分隔符组合在一起，然后又拆开，这样就太麻烦了，这个时候就要用到Json格式。

代码

$.get("../get1.aspx?type=3",

{ username :  $("#username").val() , content :  $("#content").val()  },
           function (data, textStatus){
               var data1 = ("(" + data + ")");
               if(textStatus){
                    var username = data1.username;
                    var content = data1.content;

                    var txtHtml = "Json>>" + username + "|" + content;
                    $("#resText").html(txtHtml);
               }
               else
               {
                    alert("error");
                }
           },
"JSON");

注意："JSON" 一定要写成大写，否则调用没反映

方法一定要加上，否则也不会显示出值来(我的理解是：使用这个方法后，data被整理成了对象，在data1.username的时候才会显示出来)，这点我有点不太明白，还需进行试验才行，不过至少用这种方式可以获取一个对象的值。

cs代码关于JSon

代码

private string GetInfo_Json(string username, string content)
{

UserInfo objUserInfo = new UserInfo();
        objUserInfo.username = username;
        objUserInfo.content = content;
        return new JavaScriptSerializer().Serialize(objUserInfo); ;
    }

注：采用JSON格式的时候，get1.aspx值允许一行代码，如果有其他的代码，无法返回值，关于这一点大家可以去尝试一下，其实很简单，只需要在get1.aspx里面加入html代码即可

比如：

总结：

经过以上的叙说，我们可以知道了这种链接模型也可以在不使用WebService情况下进行使用,这样这种模型的天地，我觉得打开了，完全可以做为一种独立的模型去开发，真正得做到完全与服务器语言独立，当然我们还面临很多要解决的困难，在接下来的博文中会陆续去解决。

转载于:https://www.cnblogs.com/AflutterFeather/archive/2010/01/07/1641332.html

Jquery 之Ajax方法$.get() 的运用，扩展链接模型的天地相关推荐

封装一个类似jquery的ajax方法
//封装一个类似jquery的ajax方法,当传入参数,就可以发送ajax请求 //参数格式如下{// type:"get"/"post", // dataTy ...
JQuery之Ajax方法
1.使用load()方法异步请求数据使用load()方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为: load(url,[data],[callback]) ...
jQuery的Ajax方法
$.ajax() 执行异步AJAX请求 $.ajaxPrefilter() 在每个请求发送之前且被$.ajax()处理之前,处理自定义Ajax选项或修改已存在选项 $.ajaxSetup() 为将来的 ...
移动端ajax,jQuery基于$.ajax设置移动端click超时处理方法
本文实例讲述了jQuery基于$.ajax设置移动端click超时处理方法.分享给大家供大家参考,具体如下: 这里介绍jquery click事件如何在移动端自动转换成touchstart事件. 因为 ...
ajax提交时页面转圈,jquery的ajax提交时loading提示的处理方法
方法1:使用ajaxStart方法定义一个全局的"加载中..."提示 $(function(){ $("#loading").ajaxStart(functio ...
jQuery(2) jquery的动画,jquery的ajax,Ajax的全局函数,Jquery的多库共存,Jquery的扩展
文章目录 jQuery(2) jquery的动画(封装了许多的动画方法) 淡入淡出 fadeIn 淡入(display:none) fadeOut 淡出显示隐藏 show(针对隐藏的元素 displ ...
jQuery通过ajax方法获取json数据不执行success的原因及解决方法
1.jquery通过ajax方法获取json数据不执行success回调问题描述:jquery通过ajax方法获取json数据不执行success回调方法问题原因:json格式存在问题或不符合标准 ...
使用jQuery实现ajax几种方法
一.$.ajax()可以通过发送HTTP请求加载远程数据,是jQuery最底层Ajax实现. 语法 $.ajax({"url" : "UserServlet", ...
jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法
jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法参考文章: (1)jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法 ( ...

Jquery 之Ajax方法$.get() 的运用，扩展链接模型的天地

Jquery 之Ajax方法$.get() 的运用，扩展链接模型的天地相关推荐

最新文章

热门文章