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. OpenStack cloudCompute glassary术语project,tenant,user

    1,tenantA group of users, used to isolate access to Compute resources(一组用户,用于隔离访问计算资源). An alternati ...

  2. Oracle表空间常用操作

    --创建表空间 create tablespace test datafile 'E:\test2_data.dbf' SIZE 20M autoextend on next 5M maxsize 5 ...

  3. ab -n -c

    ab是apache自带的一个很好用的压力测试工具,当安装完apache的时候,就可以在bin下面找到ab 1 我们可以模拟100个并发用户,对一个页面发送1000个请求 ./ab -n1000 -c1 ...

  4. C#整理7——函数

    数据类型--变量常量--运算符表达式--语句(顺序,分支,循环)--数组--函数 函数 1.定义:能够独立完成某个功能的模块.2.好处:1.结构更清析(编写.维护方便 ).2.代码重用.3.分工开发. ...

  5. jQuery的主要用法

    一.选择网页元素jQuery的基本设计和主要用法,就是"选择某个网页元素,然后对其进行某种操作".这是它区别于其他函数库的根本特点. 使用jQuery的第一步,往往就是将一个选择表 ...

  6. js提取整数部分，移除首末空格

    给Object.prototype增加方法可使该方法对所有对象可用,这样的方式对函数.数组.字符串.数字.正则表达式和布尔值同样适用.比如说为Function.prototype增加方法来使得改方法对 ...

  7. The executable was signed with invalid entitlements新设备run出现这个问题

    出现这个问题一般是新手不熟悉开发者发布流程造成地 一定要安开发者流程一步一步走 这样就不会出错了 注意这几个地方地设置 1.

  8. iOS下的实际网络连接状态检测(转)

    序言 网络连接状态检测对于我们的iOS app开发来说是一个非常通用的需求.为了更好的用户体验,我们会在无网络时展现本地或者缓存的内容,并对用户进行合适的提示.对绝大部分iOS开发者来说,从苹果示例代 ...

  9. OC——NSString和NSMutableString

    int main(int argc, const char * argv[]) { @autoreleasepool { //----------------NSString------------- ...

  10. js学习心得（一）（菜鸟）

    js基础已经打了好几次了,慕课跟着学了一遍,视频看了一些,还读了诸如 jsdom艺术,js精粹以及锋利jq(没读完). 这次再次重头读并写一遍代码,工具书是js,查缺补漏高级程序设计第二版,犀牛书有点 ...