Home  >  Q&A  >  body text

javascript - 关于js的ajax问题

新手刚开始学ajax,遇到个问题,为什么我的ajax提交了一次之后,修改再次提交数据无法变动?,希望那个人能告诉一下,谢谢

js代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>

    <body>
            
            姓名:<input type="text" name="user-name" />
            年龄:<input type="text" name="age"/>
            <button id="sub">提交一下</button>
        
        <script type="text/javascript">
            var oBtn = document.getElementById("btn");
            var osub=document.getElementById("sub");
            var oname=document.getElementsByName("user-name")[0];
            var oage=document.getElementsByName("age")[0];
            osub.onclick=function(e){
                var xmp=new XMLHttpRequest();
                xmp.open("POST","1.get.php",true);
                xmp.setRequestHeader("content-type","application/x-www-form-urlencoded");
                xmp.send("user-name="+oname.value+"&"+"age="+oage.value+"&"+[new Date().getMilliseconds()]);
                xmp.onreadystatechange=function(){
                    if(xmp.readyState===4){
                        if(xmp.status===200){
                            document.body.innerHTML+=xmp.responseText;
                        }
                    }
                }
            }
        </script>
    </body>

</html>

PHP代码:

<?php
    header("Content-type: text/html; charset=utf-8");
    $x=$_POST['user-name'];
    $y=$_POST['age'];
    echo "你的姓名{$x};你的年龄{$y}";
   
PHP中文网PHP中文网2771 days ago224

reply all(2)I'll reply

  • 阿神

    阿神2017-04-11 13:32:31

    ajax 传输数据没问题 刚才用你的代码试过了
    问题是 假如你第一次数据成功返回了 你的代码肯定执行了 document.body.innerHTML+=xmp.responseText; 这行代码 这样的话你的body里面就没有表单了 再怎么提交?

    reply
    0
  • 巴扎黑

    巴扎黑2017-04-11 13:32:31

    楼上正解,再建一个p添加响应信息。说个不相关的,Onreadystatechange最好加在open前

    reply
    0
  • Cancelreply