django 笔记15 ajax系列

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

# 原生操作
# jQuery操作
# 伪Ajax操作
# XMLHttpReques

伪ajax操作

<iframe src='http://www.baidu.com'><iframe>  页面嵌套

伪造一个ajax请求发往后台 页面不刷新
iframe标签 和 form表单  target  iframe name

<form action = "/ajax_json/" method = "POST" target = 'ifm1'>
    <iframe id = 'ifm1' name = 'ifm1' ></iframe>
    <input type = 'text' name = "username" />
    <input type = 'text' name = 'email' />
    <input type = 'submit' onclick="submitForm()" value = "提交"/>
</form>
<script>
    function submitForm(){
        $('#ifm1').load(function(){
            #在 iframe里找 返回的内容
            var text = $('#ifm1').contents().find('body').text();
            var obj = JSON.parse(text);

        })
    }
<script>

Ajax 原生的 jQuery 和iframe 三种
时机：
    如果发送的是普通的数据 首先用jQuery 接着XMLHttpRequest,最后再考虑iframe
    如果发送的是不普通数据（文件）

原生ajax操作
function getXHR(){
    var xhr = null;
    if(XMLHttpRequest){
        xhr = new XMLHttpRequest();
    }else{
        xhr = new ActiveXobject('Microsoft.XMLHTTP');
    }
    return xhr;
}

function Ajax1(){
    var xhr = getXHR();
    xhr.open('POST', '/ajax_json/', true);
    xhr.onreadystatechange = function(){
        if(xhr.readyState == 4){
        //接收完毕后
        var obj = JSON.parse(xhr.responseText);
        console.log(obj)
        }
    };
    xhr.setRequestHeader('k1', 'v1');
    xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded; charset-UTF-8');
    xhr.send('name=root; pwd=123')
}