Ajax--时间&提交用户名

一、时间

服务端:

        //向客户端发送服务端的时间
        string s = "<?xml version = '1.0'?>";
        s += "<time>"+DateTime.Now.ToString("yyyy年MM月dd日hh时mm分ss秒")+"</time>";
        context.Response.Write(s);
        context.Response.End();

客户端:

    <script src="Script/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function () {

            window.setTimeout(" ShowTime()",1000);//调时间函数
           
        });//ready

        //显示时间的函数
        function ShowTime() {
            $.ajax({
                url: "Ajax/Time.ashx",
                data: {},
                type: "POST",
                dataType: "XML",
                success: function (data) {
                    //解析服务端返回来的数据
                    var s = $(data).find("time").text();
                    //显示在客户端界面上
                    $("#Label1").html(s);
                }//success
            });//ajax

            window.setTimeout(" ShowTime()", 1000);
        }
    </script>

二、提交用户名

服务端:

        //获取传来的用户名
        string uid = context.Request["u"].ToString();
        //到数据库检查
        var query = _Context.Login.Where(p=>p.UserName == uid);
        bool isOK = query.Count() == 0 ? true : false;
        //返回XML数据
        string s = "<?xml version = '1.0'?><OK>" + isOK + "</ok>";
        context.Response.Write(s);
        context.Response.End();

客户端:

    <script src="Script/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function () {
            $("#txtUID").blur(function () {
                var s = $(this).val();//获取用户名

                //向服务端发送请求,并处理回调
                $.ajax({
                    url: "Ajax/CheckUID.ashx",
                    data: { u: s },
                    type: "POST",
                    dataType: "XML",
                    success: function (data) {
                        //解析服务端返回来的数据
                        var ok = $(data).find("ok").text();
                        
                        //显示在客户端界面上
                        //显示
                        if (ok == "True") {
                            $("#lbl").html("可以使用");
                        }
                        else {
                            $("#lbl").html("用户名已存在");
                        }
                    }//success
                });//ajax
            });//blur
        });//ready
    </script>

 用图片显示用户名是否存在(客户端)

    <script src="Script/jquery-1.7.1.min.js"></script>
    <script language="javascript">
        $(document).ready(function () {
            $("#txtUID").blur(function () {
                var s = $(this).val();//获取用户名

                //向服务端发送请求,并处理回调
                $.ajax({
                    url: "Ajax/CheckUID.ashx",
                    data: { u: s },
                    type: "POST",
                    dataType: "XML",
                    beforeSend: function (data) {
                        $("#Image1").show().attr("src","image/Loading5.gif");
                    },//还没向服务端提交数据,触发此函数
                    success: function (data) {
                        //解析服务端返回来的数据
                        var ok = $(data).find("ok").text();
                        
                        //显示在客户端界面上
                        //显示
                        if (ok == "True") {
                            $("#Image1").show().attr("src", "image/OK.png");//修改src属性
                            $("#Image1").attr("title","用户名可用");//气泡提示
                        }
                        else {
                            $("#Image1").show().attr("src", "image/Alert.png");//修改src属性
                            $("#Image1").attr("title","用户名已存在");//气泡提示
                        }
                    },//success
                    error:function(data){
                        $("#Image1").show().attr("src", "image/Error.png");
                        $("#Image1").attr("title","服务器出错");
                    }//服务器出错时调此函数
                });//ajax
            });//blur
        });//ready
    </script>

 complete:function(data){} ----此函数不管服务器出错还是成功,都调此函数

原文地址:https://www.cnblogs.com/qianxiaojinnian/p/4752207.html