AJAX解决更新网页的问题

4.AJAX解决更新网页的问题
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
解决:
首先编写js代码:
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","a_stu_ajax.php?a=<?php echo $_POST['textfield']; ?>",true);
xmlhttp.send();
}
</script>
其中“myDiv”是新网页的展示位置
xmlhttp.open("GET","a_stu_ajax.php?a=<?php echo $_POST['textfield']; ?>",true);
用过URL传值“a”的方式将$_POST['textfield']的值传到“a_stu_ajax.php”页面

<form name="form1" method="post" action="">
             
              <label>
                    <input type="text" name="textfield" id="textfield">
            </label> 
                    <label>
                    <input type="submit" name="button" id="button" value="提交">
             </label>
                   <label>
                        <button type="button" onclick="loadXMLDoc()">请求数据sb</button>
                    </label>
                    <?php  print "Welcome <b>" . $_POST['textfield'] . "</b><br/>";    ?>
</form>
form表单必须提交textfield才会有值   这段php代码用来证明此问题
 <button type="button" onclick="loadXMLDoc()">请求数据sb</button>用来调用js代码。

猜你喜欢

转载自blog.csdn.net/Boomoon/article/details/89001804