Simple AJAX Example

最新推荐文章于 2022-03-08 11:48:56 发布

haohappy2

最新推荐文章于 2022-03-08 11:48:56 发布

阅读量205

点赞数

文章标签： Ajax PHP JavaScript Microsoft ViewUI

本文链接：https://blog.csdn.net/haohappy2/article/details/83882476

版权

<script language="javascript">
function submitMsgForm(){
        var id = document.getElementById("id").value;
        var params = "id="+id;
        var url = "call.php";
        sendCall(url, params);
}
</script>

<form name="form" action="" method="post">
<div id="response_text"></div>
<TABLE>
<TR>
        <TD>ID</TD>
        <TD><INPUT TYPE="text" NAME="id" id="id" ></TD>
</TR>
<TR>
        <TD></TD>
        <TD><INPUT TYPE="button" name="submit" value="submit" οnclick="submitMsgForm()"></TD>
</TR>
<TR>
        <TD></TD>
        <TD><div id="response" style="width:400px;height:300px;display:none"></div></TD>
</TR>
</TABLE>

</form>


<script language="javascript">
var xmlHttp;
function sendCall(url, params) {
        if (window.ActiveXObject) {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        } else if (window.XMLHttpRequest) {
                xmlHttp = new XMLHttpRequest();
        }
        xmlHttp.onreadystatechange = callBack;
        xmlHttp.open('POST', url, true);
        xmlHttp.setRequestHeader("content-length",params.length); 
        xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        xmlHttp.setRequestHeader("Connection", "close");
        xmlHttp.send(params);
}

function callBack() {
        if (xmlHttp.readyState == 1) {
             document.getElementById("response_text").innerHTML = "get from the server..." ;
        }
        if (xmlHttp.readyState == 4) {
                if (xmlHttp.status == 200) {
                        document.getElementById("response").style.display ="block";
                        document.getElementById("response").innerHTML = xmlHttp.responseText ;
                }
        }
}
</script>

---call.php

<?php
   echo "<pre>";
   var_dump($_POST);
   echo "</pre>";
   echo 2;
?>