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. VC6使用技巧

    1.检测程序中的括号是否匹配 把光标移动到需要检测的括号(如大括号{}.方括号[].圆括号()和尖括号<>)前面,键入快捷键“Ctrl+]”.如果括号匹配正确,光标就跳到匹配的括号处,否则 ...

  2. jdbc详解（三）

    开源数据库连接池 l 现在很多 WEB 服务器 ( Weblogic , WebSphere , Tomcat) 都提供了 DataSoruce 的实现,即连接池的实现.通常我们把 DataSourc ...

  3. T-SQL索引

    索引 使用索引可以提高查询速度,不是越多越好,会损耗存储空间.应用于出现在where子句中的列建立索引.可以使用sql server 内置工具Profiler捕捉在SQL Server实例上执行的活动 ...

  4. javascript 中 offsetWidth,clientWidth;offsetHeight,clientHeight的区别

    javascript 中 offsetWidth 是对象的可见宽度,包滚动条等边线,会随窗口的显示大小改变 clientWidth.offsetWidth.clientHeight区别IE6.0.FF ...

  5. Linq to sql 实现多条件的动态查询(方法一)

    /// <summary> /// Linq to sql 多字段动态查询 /// </summary> /// <returns></returns> ...

  6. c#操作sqlite

    一.添加选中dll引用如下图 二.下载一个sqlite建表建库工具sqlitedatabasebrowser如下图 三.使用sqlitedatabasebrowser建库建表 四.插入表数据如下图 四 ...

  7. web.config详解

    在开发中经常会遇到这样的情况,在部署程序时为了保密起见并不将源代码随项目一同发布,而我们开发时的环境与部署环境可能不一致(比如数据库不一样),如果在代码中保存这些配置这些信息部署时需要到用户那里更改代 ...

  8. Spring-----Spring对AOP的支持

    转载自:http://blog.csdn.net/hekewangzi/article/details/51713002

  9. 接触CrackMe 第一个

    今天刚接触这个 做了一个简单的. 用Onlydbg加载之后,对GetDlgItemTextA函数下断点,因为程序是在控件上获取数据的. Register输入Name和Serial点击Ok之后,断点响应 ...

  10. Android 软键盘小知识点

    chatText = (EditText) findViewById(R.id.chatText); chatText.setOnKeyListener(new OnKeyListener() { p ...