<1>

$.post(url,[data],[callback],[type]) 第一个参数是地址，第二个参数是一个参数传递。第三个参数是一个回调函数。參数是请求返回数据的类型

//一个ajax的Post请求

    function submitInfo() {

        $(".warn").hide(); //刚提交的时候隐藏错误的信息

        var data = $("#formData").serialize(); //将表单的数据通过序列化表单值，创建 URL 编码文本字符串。

形成一个表单元素集合的 jQuery 对象

        $.post("/login/checkLoginInfo", data, function (ajaxObj) { //将数据提交到login控制器下的CheckLOginInfo方法。參数是data。  假设请求成功。function就是请求成功时运行的回调函数。ajaxObj是checkLoginInfo方法的返回数据

            //回传内容{status: 1(success)/0(fail),}

            if (ajaxObj.status == 0 || status == null) { //假设返回状态为0或者为null

                $(".warn").show(); //将错误信息显示出来

            } else {

                //登陆成功。跳转都制定页面

                window.location = '/HotelList/Index';

            }

        }, "json"); //这里是第四个參数，这里设置了获取数据的类型，所以得到的数据格式为json类型的

    }

<2>

注意这条语句的參数。与回调函数 loginFinish 与上面条$.Post()请求的差别

$.post("/ajax/UserLogin.ashx",

                    { "username": username, "password": password },

                    loginFinish);

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

    <link href="/css/ui-lightness/jquery-ui-1.8.2.custom.css" rel="stylesheet" type="text/css" />

    <script src="/js/jquery-1.4.2.js" type="text/javascript"></script>

    <script src="/js/jquery-ui-1.8.2.custom.js" type="text/javascript"></script>

    <script type="text/javascript">

        //向服务器请求当前登录状态。然后切换登录区域的显示

        var checkLogin = function () {

            $.post("/ajax/CheckLogin.ashx", function (data) {

                var strs = data.split("|");

                if (strs[0] == "no") {

                    //alert("木有登陆");

                    $("#divLoginArea").show(); //假设没有登陆就显示"登陆"

                    $("#divLoginOutArea").hide(); //隐藏"注销"

                }

                else {

                    //切换“登录”、“注销”的两个层

                    $("#divLoginArea").hide(); //隐藏"登陆"

                    $("#divLoginOutArea").show(); //显示 "注销"

                    $("#spanUserName").text(strs[1]);//把当前登录username显示出来

                }

            });

        }

        var loginFinish = function (data) {  //这是一个回调函数

            if (data == "ok") {

                //alert("成功");

                $("#divLogin").dialog("close"); //登录成功关闭窗体

                checkLogin();//登录成功。刷新登录区域的显示

            }

            else {

                alert("username密码错误");

            }

        };

        $(function () {

            $("#btnShowLoginDlg").click(function () {

                $("#divLogin").dialog({

                    height: 200,

                    modal: true

                });

            });

            $("#btnLogin").click(function () {  //当用户点击"登陆" 控件触发事件

                //todo:检验username、密码不能为空

                var username = $("#txtUserName").val();

                var password = $("#txtPwd").val();

                $.post("/ajax/UserLogin.ashx",//----------------------请关注这条$.Post()请求的參数与回调函数

                    { "username": username, "password": password },

                    loginFinish);

            });

        });

        $(function () {

            checkLogin();//刚进入页面的时候也是先向服务器查询当前登录状态

            $("#btnLogout").click(function () {

                $.post("/ajax/Logout.ashx", function () {

                    checkLogin();//刷新显示

                });

            });

        });

    </script>

    <asp:ContentPlaceHolder ID="head" runat="server">

    </asp:ContentPlaceHolder>

</head>
<body>

    <form id="form1" runat="server">

    <div>

        <div id="divLoginArea" style="display:none"><input type="button" value="登录" id="btnShowLoginDlg" /></div>

        <div id="divLoginOutArea" style="display:none">

            <span id="spanUserName"></span>

            <input type="button" value="注销" id="btnLogout" />

        </div>

        <div id="divLogin" title="登录窗体"  style="display:none">

            <table>

                <tr><td>username：</td><td><input type="text"  id="txtUserName"/></td></tr>

                <tr><td>密码：</td><td><input type="password"  id="txtPwd"/></td></tr>

                <tr><td colspan="2"><input type="button" value="登录" id="btnLogin" /></td></tr>

            </table>

        </div>

        <br />

        <asp:ContentPlaceHolder ID="placeHolderMain" runat="server">

        </asp:ContentPlaceHolder>

        <br />

         尾部<br />

    </div>

    </form>

</body>

</html>





版权声明：本文博客原创文章。博客，未经同意，不得转载。

一个ajax的Post要求的更多相关文章

  1. Javascript:来一个AJAX封装函数

    前不久换工作了,最近一直在出差,忙得跟狗一样,所以博客都荒废许久了. 最近的工作中涉及到大量的ajax操作,本来该后台做的事也要我来做了.而现在使用的ajax函数是一个后台人员封装的—-但他又是基于 ...

  2. 为大家分享一个 Ajax Loading —— spin.js

    我们在做Ajax 异步请求的时候,一般都会利用一个动态的 Gif 小图片来制作一个Ajax Loading ,以便增加用户体验. 今天在网上发现了一个 Spin.js ,该 js 脚本压缩后5k,可以 ...

  3. 写一个ajax程序就是如此简单

    写一个ajax程序就是如此简单 ajax介绍: 1:AJAX全称为Asynchronous JavaScript and XML(异步JavaScript和XML),指一种创建交互式网页应用的网页开发 ...

  4. 为大家分享一个 Ajax Loading —— spin.js（转）

    原文地址:http://www.cnblogs.com/lxblog/p/3425599.html 我们在做Ajax 异步请求的时候,一般都会利用一个动态的 Gif 小图片来制作一个Ajax Load ...

  5. 利用jquery+iframe做一个ajax上传效果

    以下是自学it网--中级班上课笔记 网址:www.zixue.it html页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict ...

  6. 捣鼓一个Ajax请求管理器

    随着前端技术的不断发展,现在做的项目里很多页面里都会有大量的ajax请求,随之而来就有了一些问题: 1.没必要的ajax请求怎么处理? 2.ajax链式调用怎么维护? ajax链式调用最原始的写法: ...

  7. 封装一个Ajax工具函数

    /*封装一个ajax工具函数*/ window.$ = {}; /*通过$定义一个ajax函数*/ /* * 1. type   string   请求的方式  默认是get * 2. url     ...

  8. 第一个ajax小demo

    第一个ajax小demo 文章来源:http://blog.csdn.net/magi1201/article/details/44569657

  9. 又一个ajax实例，结合jQuery

    又一个ajax实例,配合jQuery   html <!DOCTYPE html> <html lang="zh-cn"> <head> < ...

随机推荐

  1. Linux内核的同步机制---自旋锁

    自旋锁的思考:http://bbs.chinaunix.net/thread-2333160-1-1.html 近期在看宋宝华的<设备驱动开发具体解释>第二版.看到自旋锁的部分,有些疑惑. ...

  2. 采用大杀招QEMU调试Linux内核代码

    Linux调试内核代码是非常麻烦.它们一般加printk, 或者使用JTAG调试. 这里的方法是使用QEMU为了调试Linux核心. 由于QEMU自己实现gdb server, 它可以容易地使用gdb ...

  3. iOS 通过HEX(十六进制)得到一个UIColor的对象

    inline static UIColor* getColorFromHex(NSString *hexColor) { if (hexColor == nil) { return nil; } un ...

  4. MyEclipse建立JVM内存大小

    1.你为什么要设置JVM它的内存大小? 因为假定程序执行过JVM默认的内存大小.他们不会报告传说中的内存溢出异常. Exception in thread "main" java. ...

  5. Cocos2d-x学习笔记（五岁以下儿童） 精灵两种方式播放动画

     这几天在看控件类,临时没有想好实际运用的方向.单纯的创建网上已经有非常多这方面的样例,我就不写了.接下来是学习精灵类.精灵类若是单独学习也是非常easy.于是我加了一些有关动画方面的知识点与精灵 ...

  6. 在Linux上安装Hadoop

    先决条件: Hadoop是用JAVA写的,所以首先要安装Java.在Ubuntu上安装JDK见:http://blog.csdn.net/microfhu/article/details/766739 ...

  7. android横竖屏控制

    代码中设置activity屏幕为全屏,并设置横竖屏状态 getwindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowM ...

  8. IT忍者神龟之使用 PowerDesigner

    1. 启动 PowerDesigner 新建物理数据模型 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdmlweWhk/font/5a6L5L2T/fon ...

  9. Shuttle ESB（四）——宣布订阅模式实例介绍（1）

    前,我的重点是关注的三篇文章Shuttle ESB入境和宏观的概念范例. Shuttle ESB模式:请求/对应模式与Pub/Sub模式. 关于这两种模式的区分,请看以下文章的介绍:Shuttle E ...

  10. Web API 数据流使用

    ASP.NET Web API 应用教程(一) ——数据流使用   相信已经有很多文章来介绍ASP.Net Web API 技术,本系列文章主要介绍如何使用数据流,HTTPS,以及可扩展的Web AP ...