原生ajax源码

 function GetXHR(){

             var xhr = null;

             if(XMLHttpRequest){

                 xhr = new XMLHttpRequest();        #如果没有XMLHttpRequest对象就使用ie的ActiveXObject("Microsoft.XMLHTTP")对象

             }else{

                 xhr = new ActiveXObject("Microsoft.XMLHTTP");

             }

             return xhr;

         }

         function XhrPostRequest(){

             var xhr = GetXHR();

             // 定义回调函数

             xhr.onreadystatechange = function(){

                 if(xhr.readyState == 4){

                     // 已经接收到全部响应数据，执行以下操作

                     var data = xhr.responseText;

                     console.log(data);

                 }

             };

             // 指定连接方式和地址----文件方式

             xhr.open('POST', "/test/", true);

             // 设置请求头

             xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset-UTF-8'); #使用POST的方法是需要加一个请求头

             // 发送请求

             xhr.send('n1=1;n2=2;');

         }

         function XhrGetRequest(){

             var xhr = GetXHR();

             // 定义回调函数

             xhr.onreadystatechange = function(){

                 if(xhr.readyState == 4){

                     // 已经接收到全部响应数据，执行以下操作

                     var data = xhr.responseText;

                     console.log(data);

                 }

             };

             // 指定连接方式和地址----文件方式

             xhr.open('get', "/test/", true);

             // 发送请求

             xhr.send();

         }

     jQuery的ajax提交在返回函数这里

     success：function(arg,a1,a2)这几个参数里面有一个就是XMLHtt

伪ajax操作源码

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Title</title>

 </head>

 <body>

 <!--<input type="text" id="url"/>

 <input type="button" value="提交" onclick="iframerequest();"/>

 <iframe id="iframe" src="https://www.baidu.com"> </iframe>-->

 {#伪ajax提交#}

 <input type="text">

 <form action="/ajax_json/" method="POST" target="iframe1">

     <iframe id="ifml" name="iframe1" onload="iframeload();"></iframe>

     {% csrf_token %}

     <input type="text" name="username"/>

     <input type="text" name="email"/>

     <input type="submit" value="form提交" onclick="sunmit()"/>

 </form>

 <script src="/static/jquery.js"></script>

 <script>

    /* function iframerequest(){

     var url=$('#url').val();

     $('#iframe').attr('src',url)*/

    /* function iframeload(){

         console.log('233333')

     }*/

     function sunmit(){

         $('#ifml').load(function () {

             var text=$('#ifml').contents().find('body').text();

             var obj = JSON.parse(text);

             console.log(obj)

         })

     }

 </script>

 </body>

 </html>
 def ajax(request):

     print request.POST

     ret = {'code':True,'data':None}

     import json

     return  render(request,'ajax.html')

 def ajax_json(request):

     print request.POST

     ret = {'code':True,'data':request.POST.get('username')}

     import json

     return  HttpResponse(json.dumps(ret))

记录笔记

参考博客：

		http://www.cnblogs.com/wupeiqi/articles/5703697.html

	原生

	function GetXHR(){

            var xhr = null;

            if(XMLHttpRequest){

                xhr = new XMLHttpRequest();        #如果没有XMLHttpRequest对象就使用ie的ActiveXObject("Microsoft.XMLHTTP")对象

            }else{

                xhr = new ActiveXObject("Microsoft.XMLHTTP");

            }

            return xhr;

        }

        function XhrPostRequest(){

            var xhr = GetXHR();

            // 定义回调函数

            xhr.onreadystatechange = function(){

                if(xhr.readyState == 4){

                    // 已经接收到全部响应数据，执行以下操作

                    var data = xhr.responseText;

                    console.log(data);

                }

            };

            // 指定连接方式和地址----文件方式  是否异步 true

            xhr.open('POST', "/test/", true);

            // 设置请求头

            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset-UTF-8'); #使用POST的方法是需要加一个请求头

            // 发送请求

            xhr.send('n1=1;n2=2;');

        }

        function XhrGetRequest(){

            var xhr = GetXHR();

            // 定义回调函数

            xhr.onreadystatechange = function(){

                if(xhr.readyState == 4){

                    // 已经接收到全部响应数据，执行以下操作

                    var data = xhr.responseText;

                    console.log(data);

                }

            };

            // 指定连接方式和地址----文件方式

            xhr.open('get', "/test/", true);

            // 发送请求

            xhr.send();

        }

	jQuery的ajax提交在返回函数这里

	success：function(arg,a1,a2)这几个参数里面有一个就是XMLHttpRequest，可以在这个对象里面取到所有想取的东西

	伪Ajax操作

	<iframe></iframe>标签

	<form action="/ajax_json/" method="POST" target="iframe1">

    <iframe id="ifml" name="iframe1" onload="iframeload();"></iframe>

    {% csrf_token %}

    <input type="text" name="username"/>

    <input type="text" name="email"/>

    <input type="submit" value="form提交" onclick="sunmit()"/>

</form>

	    function sunmit(){

        $('#ifml').load(function () {                    #给iframe的onload绑定事件，当执行onload的时候获取后台返回的数据，然后进行相关的操作

            var text=$('#ifml').contents().find('body').text();

            var obj = JSON.parse(text);

            console.log(obj)

        })

	时机：

		如果发送的是【普通数据】 -> jQuery，XMLHttpRequest，iframe

　　

原生ajax与伪ajax的更多相关文章

  1. 框架----Django之Ajax全套实例（原生AJAX，jQuery Ajax，“伪”AJAX，JSONP，CORS）

    一.原生AJAX,jQuery Ajax,“伪”AJAX,JSONP 1. 浏览器访问 http://127.0.0.1:8000/index/ http://127.0.0.1:8000/fake_ ...

  2. 手动(原生ajax)和自动发送ajax请求 伪ajax(Ifrname)

    自动发送  ---> 依赖jQuery文件 实例-->GET请求: function AjaxSubmit() { $.ajax({ url:'/data', type:"GET ...

  3. ajax之---“伪”ajax

    views.py def ajax1(request): ret={'status':'true','message':'successful'} return HttpResponse(json.d ...

  4. 33)django-原生ajax,伪ajax

    一:概述 对于WEB应用程序:用户浏览器发送请求,服务器接收并处理请求,然后返回结果,往往返回就是字符串(HTML),浏览器将字符串(HTML)渲染并显示浏览器上. 1.传统的Web应用 一个简单操作 ...

  5. 前端 - js方式Ajax/ jquery方式Ajax / 伪 ajax /伪ajax 进阶方式

    DJANGO环境搭建: 目录文件: 关闭CSRF 添加目录文件路径 配置url 视图配置: index页面配置: 测试:(成功) 进入正题: ajax 通过GET提交数据至后台: <!DOCTY ...

  6. 原生Ajax 和Jq Ajax

    前言:这次介绍的是利用ajax与后台进行数据交换的小例子,所以demo必须通过服务器来打开.服务器环境非常好搭建,从网上下载wamp或xampp,一步步安装就ok,然后再把写好的页面放在服务器中指定的 ...

  7. 分享一个基于长连接+长轮询+原生的JS及AJAX实现的多人在线即时交流聊天室

    实现网页版的在线聊天室的方法有很多,在没有来到HTML5之前,常见的有:定时轮询.长连接+长轮询.基于第三方插件(如FLASH的Socket),而如果是HTML5,则比较简单,可以直接使用WebSoc ...

  8. 一个伪ajax图片上传代码的例子

    一个伪ajax图片上传实现代码. 复制代码代码如下: <?php  if($_FILES){  ?>  <script>  window.parent.ajaxUploadPi ...

  9. 伪ajax上传文件

    伪ajax上传文件   最近在折腾伪ajax异步上传文件. 网上搜索了一下,发现大部分方法的input file控件都局限于form中,如果是在form外的呢? 必须动态生成一个临时form和临时if ...

随机推荐

  1. Codeforces 960F Pathwalks ( LIS && 树状数组 )

    题意 : 给出若干个边,每条边按照给出的顺序编号,问你找到一条最长的边权以及边的编号同时严格升序的一条路径,要使得这条路径包含的边尽可能多,最后输出边的条数 分析 :  这题和 LIS 很相似,不同的 ...

  2. 容器适配器————queue

    只能访问 queue<T> 容器适配器的第一个和最后一个元素.只能在容器的末尾添加新元素,只能从头部移除元素. 操作 queue<int> q;//创建一个int型的空队列q ...

  3. Selenium 三种等待方式详解

    我们在做WEB自动化时,一般要等待页面元素加载完成后,才能执行操作,否则会报找不到元素的错误,这样就要求我们在有些场景下加等待时间. 我们平常用到的有三种等待方式: 强制等待 隐式等待 显示等待 一. ...

  4. Java中参数的引用传递和值传递

    1.一些定义 值传递:把实际传入参数的值,在内存中赋值一份 引用传递:传入的是实际参数的地址 2.传递基本类型的参数 因为Java是值传递,那就不难理解下面的代码不交换任何值 swap(Type ar ...

  5. GoldenGate—AUTORESTART配置

    AUTORESTART Valid For Manager Description Use the AUTORESTART parameter to start one or more Extract ...

  6. 506C Mr. Kitayuta vs. Bamboos

    分析 代码 #include<bits/stdc++.h> using namespace std; #define int long long ],h[],now[],cnt[]; in ...

  7. TP3.2写分页

    用TP3.2写分页 手册上说的好难懂,我自己去网上找资料 ,现在整理一下,以后可能会用: 在Think下面有Page.class.php类: 我在这个下面放了一个function.php的(算是类吧又 ...

  8. ArcCatalog连接远程ArcGIS Server服务器

    注意:本地机器登陆的用户名和密码必须与ArcGIS Server服务器上的用户名和密码完全一致,并加入到agsadmin和agsuser组中.重启电脑.   (其实就是在自己的电脑上建立一个用户名,这 ...

  9. RocketMQ 消费者

    本文分析 DefaultMQPushConsumer,异步发送消息,多线程消费的情形. DefaultMQPushConsumerImpl MQClientInstance 一个客户端进程只有一个 M ...

  10. 测开之路一百三十三：实现sql函数封装

    连接数据库的频率很高,所以把数据库操作封装起来 函数封装: def make_dicts(cursor, row): """ 将游标获取的Tuple根据数据库列表转换为d ...