ajax获取时间的html代码

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title></title>

    <script type="text/javascript">

        window.onload = function () {

            document.getElementById("btnGetTime").onclick = function () {

                //向服务器请求  时间

                //1.创建异步对象（小浏览器）

                var xhr = new XMLHttpRequest();

                //2.设置参数

                xhr.open("get", "GetTime.ashx?name=lxz", true);

                //3.让get请求不从浏览器获取缓存数据

                xhr.setRequestHeader("If-Modified", "0");

                //3.设置回调函数

                xhr.onreadystatechange = function () {

                    //3.1当完全接收完响应报文后，并且 响应状态码为200的时候

                    if (xhr.readyState == 4 && xhr.status == 200) {

                        //3.2获取响应报文体内容

                        var res = xhr.responseText;

                        alert(res);

                    }

                };

                //4.发送异步请求

                xhr.send(null);

            };

            document.getElementById("btnPostTime").onclick = function () {

                //向服务器请求  时间

                //1.创建异步对象（小浏览器）

                var xhr = new XMLHttpRequest();

                //2.设置参数

                xhr.open("post", "GetTime.ashx", true);

                //post请求不会使用浏览器端请求。。。所以不需要下面这段代码

                ////3.让get请求不从浏览器获取缓存数据

                //xhr.setRequestHeader("If-Modified", "0");

                //设置请求报文体的  编码格式（设置  表单默认编码格式）

                xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

                //3.设置回调函数

                xhr.onreadystatechange = function () {

                    //3.1当完全接收完响应报文后，并且 响应状态码为200的时候

                    if (xhr.readyState == 4 && xhr.status == 200) {

                        //3.2获取响应报文体内容

                        var res = xhr.responseText;

                        alert(res);

                    }

                };

                //4.发送异步请求

                //xhr.send();//第一种方式{name:"lxz"})

                xhr.send("name=lxz");

            };

        };

    </script>

</head>

<body>

    <form enctype="application/x-www-form-urlencoded"></form>

    <input type="button" id="btnGetTime" value="get获取服务器时间" />

    <input type="button" id="btnPostTime" value="post获取服务器时间" />

    <img src="img/1.gif" />""

</body>

GetTime.ashx页面代码

 context.Response.ContentType = "text/plain";

            //接收浏览器  Ajax  方式发送过来的  get参数

            //string strName = context.Request.QueryString["name"];

            //无论get还是post都能接收

            string strName = context.Request.Params["name"];

            //休息1s钟

            System.Threading.Thread.Sleep(1000);

            //输出响应报文

            context.Response.Write(DateTime.Now.ToString()+",name="+strName);

这时我们在浏览器中查看时就会发现图片保持动不变，会弹出时间提示框

简单的Ajax的更多相关文章

  1. jQuery简单的Ajax调用示例

    jQuery确实方便,下面做个简单的Ajax调用: 建立一个简单的html文件: <!DOCTYPE HTML> <html> <head> <script ...

  2. jsonp其实很简单【ajax跨域请求】

    js便签笔记(13)——jsonp其实很简单[ajax跨域请求] 前两天被问到ajax跨域如何解决,还真被问住了,光知道有个什么jsonp,迷迷糊糊的没有说上来.抱着有问题必须解决的态度,我看了许多资 ...

  3. 利用jQuery与.ashx完成简单的Ajax

    在ASP.NET同样可以与其它编程语言一样,利用前台的Ajax技术,只是需要注意的是,后台的处理程序不再是一个aspx页面中的Page_Load,而且ASP.NET独有的“一般处理程序”.ashx,下 ...

  4. 简单的Ajax实例

    由于刚刚接触Ajax,所以在网上搜了一下如何实现简单的Ajax,在此写下来,也方便自己以后学习 什么是Ajax? 通过在后台与服务器进行少量的数据交换,Ajax可以使网页实现异步更新,这意味着可以在不 ...

  5. thinkphp5最最最最简单的ajax实例

    thinkphp5最最最最简单的ajax实例 一.总结 一句话总结:页面端使用$.get()方法传递ajax请求,服务器端判断是不是ajax请求,是的话接受参数,进行逻辑处理之后向客户端返回值. 1. ...

  6. jQuery-实现简单的Ajax请求封装

    封装的意义在于复用,在于减少重复的代码. 我在项目中做了简单的Ajax请求封装,实现方式如下: //封装Ajax请求 $.extend({ ajaxDirect:function(url,type,d ...

  7. 模拟jQuery简单封装ajax

    /*模拟jQuery的写法 (简单写法)*/ var $={}; /*ajax*/ $.ajax = function (options) { /* * 请求 * 1.请求接口 type get po ...

  8. 用javascript简单封装AJAX

    1.创建一个AJAX引擎对象 var CreateAjax = function () { var xhr = null; if (window.XMLHttpRequest) { //非IE游览器 ...

  9. ASP.NET中一种超简单的Ajax解决方案

    为什么是Ajax2? 因为之前有一个blqw.Ajax,并且已经在项目中投入使用了,但是没有这个方便,这个是后来才弄的,为了纪念第一版的blqw.Ajax,所以这个就2了... 话说看了评论才发现,原 ...

  10. js便签笔记（13）——jsonp其实很简单【ajax跨域请求】

    前两天被问到ajax跨域如何解决,还真被问住了,光知道有个什么jsonp,迷迷糊糊的没有说上来.抱着有问题必须解决的态度,我看了许多资料,原来如此... 为何一直知道jsonp,但一直迷迷糊糊的不明白 ...

随机推荐

  1. UIView添加事件

    UIView *loadView = [[UIControl alloc]initWithFrame:CGRectMake(0,0,320,480)]; loadView.backgroundColo ...

  2. js解决通过json传来的timestamp类型时间的显示问题

    [javascript] view plaincopyprint? function timeStamp2String(time){ var datetime = new Date(); dateti ...

  3. 2.2.2 胸腰差和胸臀差的应用_米人NOONE_新浪博客

    2.2.2  胸腰差和胸臀差的应用_米人NOONE_新浪博客 腰差和胸臀差的应用(2009-06-16 19:24:57)转载▼标签:校园         前面已经对这两个概念作了简单的讲解.这两个概 ...

  4. 常用wxPython事件描述

          事件描述 EVT_SIZE 由于用户干预或由程序实现,当一个窗口大小发生改变时发送给窗口. EVT_MOVE 由于用户干预或由程序实现,当一个窗口被移动时发送给窗口. EVT_CLOSE ...

  5. Sqlparameter防SQL注入

    一.SQL注入的原因 随着B/S模式应用开发的发展,使用这种模式编写应用程序的程序员也越来越多.但是由于这个行业的入门门槛不高,程序员的水平及经验也参差不齐,相当大一部分程序员在编写代码的时候,没有对 ...

  6. ExecuteReader(),ExecuteNonQuery(),ExecuteScalar(),ExecuteXmlReader()之间的区别

    本文来自:http://www.cnblogs.com/zhouxiaxue/archive/2006/05/12/398266.html http://www.cnblogs.com/yaoxc/a ...

  7. JavaScript学习笔记——简单无缝循环滚动展示图片的实现

    今天做了一个简单的无缝循环滚动的实例,这种实例在网页中其实还挺常见的,下面分享一下我的学习收获. 首先,无缝滚动的第一个重点就是——动.关于怎么让页面的元素节点动起来,这就得学明白关于JavaScri ...

  8. UVA 10410 Tree Reconstruction

    题意: 给定一个树的BFS和DFS,求这棵树. 分析: 拿dfs的序列,分成若干段,每一段相当一个子树,这样就可以利用bfs的序列去将dfs的序列分段,然后利用一个队列去存放每一段,不断求出子树即可. ...

  9. Parallel多线程

    随着多核时代的到来,并行开发越来越展示出它的强大威力!使用并行程序,充分的利用系统资源,提高程序的性能.在.net 4.0中,微软给我们提供了一个新的命名空间:System.Threading.Tas ...

  10. 图的最短路径问题————树上奶牛（tree.cpp）

    和往常一样,继续从题目引入 树上奶牛 (tree.cpp) [题目描述] 农夫John的奶牛不是住在地上而是住在树上的QWQ. 奶牛之间需要串门,不过在串门之前他们会向John询问距离的大小.可是Jo ...