<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. 【甘道夫】Apache Hadoop 2.5.0-cdh5.2.0 HDFS Quotas 配额控制

    前言 HDFS为管理员提供了针对文件夹的配额控制特性,能够控制名称配额(指定文件夹下的文件&文件夹总数),或者空间配额(占用磁盘空间的上限). 本文探究了HDFS的配额控制特性,记录了各类配额 ...

  2. 移动web性能优化笔记

    移动web性能优化 最近看了一些文章,对移动web性能优化方法,做一个简单笔记 笔记内容主要出自 移动H5前端性能优化指南和移动前端系列——移动页面性能优化

  3. C语言 cgi(3)

    1cs3157 – Advanced ProgrammingSummer 2014, Project 1, 150 pointsJune 17, 2014Follow these step-by-st ...

  4. gopkg：一种方便的go pakcage管理方式

    在使用go的过程中,我们有时候会引入一些第三方库来使用,而通常的方式就是使用go get,可是这样的方式有一个非常严重的问题,假设第三方库更新了相关接口,非常有可能你就无法使用了,所以我们一套非常好地 ...

  5. Java 过滤器的作用

    Servlet API 非常久曾经就已成为企业应用开发的基石,而 Servlet 过滤器则是对 J2EE 家族的相对较新的补充.在 J2EE 探索者 系列文章的最后一篇中,作者 Kyle Gabhar ...

  6. VMWare网络设置的3中方式(转)

    一 VMware网络设置的三种方式 1 Host-only连接方式  让虚机具有与宿主机不同的各自独立IP地址,但与宿主机位于不同网段,同时为宿主主机新增一个IP地址,且保证该IP地址与各虚机IP地址 ...

  7. repeater操作

    protected void rpRole_ItemDataBound(object sender, RepeaterItemEventArgs e) { if (e.Item.ItemType == ...

  8. Android 学习历程摘要（二）

    1.资源文件命名仅仅能小写,否则会报错生成不了R.java文件 2.R文件导包时应该导入自己project的包,而不是android.R 3.数据库操作使用SqliteOpenHelper 4.val ...

  9. async And await异步编程活用基础

    原文:async And await异步编程活用基础 好久没写博客了,时隔5个月,奉上一篇精心准备的文章,希望大家能有所收获,对async 和 await 的理解有更深一层的理解. async 和 a ...

  10. newinstance()和new有什么区别?(转)

    在初始化一个类,生成一个实例的时候:newInstance() 和 new 有什么区别? 用newInstance与用new是区别的,区别在于创建对象的方式不一样,前者是使用类加载机制,那么为什么会有 ...