Ajax向後臺發送數據

Ajax向後臺發送數據，三種狀況：

1：Ajax手動發數據

#GET  發數據
<div>  
        <a class="btn" onclick="AjaxSubmit1();">點我</a>
       
 </div>
<script src="/static/js/jquery-3.2.0.js"></script>
    <script>


        function AjaxSubmit1() {
            $.ajax({
                url:'/ajax1.html',
                type:'GET',
                data:{'p':123},
                success:function (arg) {

                }
            })

        }
 </script>

 
#POST 發送數據
function AjaxSubmit3() {
            $.ajax({
                url:'/ajax1.html',
                type:'POST',
                data:{'p':123},
                success:function (arg) {

                }
            })

        }

 

2：HMLHttpRequest方法

#get發送數據

 function AjaxSubmit2() {
            var xhr=new XMLHttpRequest();
            xhr.onreadystatechange=function () {
                if(xhr.readyState==4){
                    //接受完畢服務器返回的數據
                    console.log(xhr.responseText);
                }
            };
            xhr.open('GET','/ajax1.html?p=123');

            xhr.send('null');
        }

#POST發送數據

function AjaxSubmit4() {
            var xhr=new XMLHttpRequest();
            xhr.onreadystatechange=function () {
                if(xhr.readyState==4){
                    //接受完畢服務器返回的數據
                    console.log(xhr.responseText);
                }
            };
            xhr.open('POST','/ajax1.html');
            xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded;charset-UTF-8')
            xhr.send('p=456');
        }

 

3：Iframe標籤+Form表單（‘僞’Ajax）

 <h6>基於iframe+Form表單</h6>
        <iframe id='iframe' name="ifra"></iframe>
        <form id='fm' action="/ajax1.html" method="POST" target="ifra">
            <input name="root" value="111"/>
            <a onclick="AjaxSubmit5();">提交</a>


function reloadIframe() {
{#            this.contentWindow#}
            var content=this.contentWindow.document.body.innerHTML;
            var obj=JSON.parse(content);
            if(obj.status){
                alert(obj.message);
            }
        }

 

 

 

ps:基於Iframe發送數據

<h6>學習iframe</h6>
        <div>
            <input id="url" placeholder="請輸入URL"/><a onclick="Test1();">查看</a>
        </div>
        <iframe id='iframe' style="height: 800px;width: 600px;" src="http://www.autohome.com.cn"></iframe>



 function Test1() {
            var url=$('#url').val();
            $('#iframe').attr('src',url);
        }