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. JIRA官方：为什么要用JIRA？

    因为你有各种事务 工作中总是有各种事务要去处理,而这些事务不仅仅是代码中的Bug.这些事务充斥在你的收件箱中,各种想法散落在 Excel表格里,需求隐藏在原有的业务系统中.使用JIRA可以轻松捕捉和管 ...

  2. 【POJ】3468 A Simple Problem with Integers ——线段树 成段更新 懒惰标记

    A Simple Problem with Integers Time Limit:5000MS   Memory Limit:131072K Case Time Limit:2000MS Descr ...

  3. User has no SELECT privilege on V$SESSION

         今天是2013-09-20,最近心情一直很差,但是也不能不学习啊,无论怎么样,自己学到 的东西永远都是自己的.加油! 使用dbms_xplan.display_cursor function ...

  4. 无限的路_hdu_2073(AC).java

    无限的路 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total Submi ...

  5. javacript 面向对象

    1.对象 使用Object创建对象 var p = new Object(); p.name = 'jason'; p.sayName = function(){ alert(this.name); ...

  6. sql的基本查询语句

    --------------------------------------------基本常用查询-------------------------------------- 自己简单练习做了个表. ...

  7. leetcode_question_125 Valid Palindrome

    Given a string, determine if it is a palindrome, considering only alphanumeric characters and ignori ...

  8. PAT A 1065. A+B and C (64bit) (20)

    题目 Given three integers A, B and C in [-263, 263], you are supposed to tell whether A+B > C. Inpu ...

  9. Erp第三章：管理问题与MRP、MRP2、ERP

    1企业管理者经常头疼问题:一.“产供销”严重脱节 .       二.财务数据和业务数据对不上号 2.MRP(物料需求计划,Material Requiremengts Planning),MRP2( ...

  10. iOS分类

    ios中的分类其实就是把两个类用两个或多个文件写的,,在平时的开发中我们会发现有的时候我们想要一个类多个什么功能  但是已经定义好的类中没有,,我们又不想更改我们的程序  那么现在的这种情况下我就可以 ...