使用jQuery ajax提交表单

场景：对于本身表单就可以提交，或者jquery，js原生都可以提交并进行验证，不知道ajax多个返回数据要用来干嘛，今天笔试的题目就是如标题所示的要求。

html代码：

<form id="myForm" name="myForm" method="post">
    <label> username:</label>
    <input name="username" id="username" required />
    <label> password:</label>
    <input name="password" id="password" required />
    <input type="button" name="btnLogin" id="btnLogin"/>
</form>

jquery代码

<script>
    $("#btnLogin").click(function () {
        //获取用户名称
                var username=$("#username").val();
                //获取输入密码
                var password= $("#password").val();
                //开始发送数据
                $.ajax({
                    url: "Login.php", //登录处理页
                    dataType: "text",
                    //传送请求数据
                    data: { username:username, password: password},
                    success: function (data) { 
                        if (data) {
                            alert("登录成功！");
                        }
                    }
                })
            })
</script>

再来段原生JS（哈哈我是原生控）

<script>
    var form=document.forms["myForm"];//通过name属性取得表单
    //var form = document.getElementById("myForm");
    var username = form.elements["username"];//通过name属性取得表单元素
    var password = form.elements["password"];
    form.elements["btnLogin"].onclick = function(event){
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function(){
            if(xhr.readystate == 4 && xhr.state >= 200)
                if(xhr.responseText){
                    alert("登录成功!");
                }
            }
        }
        xhr.open("post","Login.php",true);
        xhr.send("username="+username+"&password="+password);
    }

</script>

Login.php代码

<?php
    header("Content-Type:text/plain");
    $username = $_POST["username"];
    $password = $_POST["password"];
    if($username == $_SESSION["username"]&&$password == $_SESSION["password"])
        echo true;
?>

其实后台返回的数据应该远不止一个验证这么简单，但是大概的流程就是这样，后台用C#也可以，但是打开VS的成本太高，就写了段PHP代码，偷懒一下哈。