手记

原生js---ajax---post方法传数据

<!DOCTYPE html>
    <html>
        <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
        <body>
            姓名:<input type="text" name="user" id="user" value="" />
            年龄:<input type="text" name="age" id="age" value="" />
            <button id="btn">点击</button>
        </body>
    <script>
        var btn=document.getElementById("btn");
            btn.=function(){
            var userval=document.getElementById("user").value;
            var ageval=document.getElementById("age").value;
            //1.创建ajax对象(此处兼容性的创建)
            var xhr=null;
            try{
            xhr=new XMLHttpRequest();
            }catch(e){
            xhr=new ActiveXObject("Microsoft.XMLHTTP");
            }
            //2.调用open方法(true----异步)
            xhr.open("post","links/2.post.php",true);
            //3.发送数据
            xhr.setRequestHeader('content-type','application/x-www-form-urlencoded');
            xhr.send("username="+userval+"&age="+ageval+"&timp"+new Date().getTime());
            //4.请求状态改变事件
            xhr.onreadystatechange=function(){
                if(xhr.readyState==4){
                    if(xhr.status==200){
                    document.write(xhr.responseText)
                    }else{
                    alert("错误"+xhr.status)
                    }
                }
            }
        }
    </script>
</html>


0人推荐
随时随地看视频
慕课网APP