• 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){} ----此函数不管服务器出错还是成功,都调此函数

  • 相关阅读:
    JSP application用法
    JSP到底内置了几大对象?
    ConcurrentHashMap之实现细节 5
    假如我是JAVA开发人员
    jBPM
    ServletContext与ServletConfig分析
    oracle建立索引原则
    70个新鲜实用的JavaScript和Ajax技术(上)
    ConcurrentHashMap之实现细节
    ConcurrentHashMap之实现细节3
  • 原文地址:https://www.cnblogs.com/qianxiaojinnian/p/4752207.html
Copyright © 2020-2023  润新知