原生态的Ajax

视图

<style>
    .bb {
        color:red;
    }

</style>
<form>
    <div class="form-group">
        <label>账号：</label>
        <input type="text" id="userName" name="Name" />
    </div>
    <label id="dd"></label>
    <div class="form-group">
        <label>密码：</label>
        <input type="password" />
    </div>
    <input type="submit" value="登录" />
</form>


@section scripts{
    <script type="text/javascript">

        $("#userName").blur(function () {                   //鼠标失去焦点执行
            var userName = $("#userName").val();            //获取账号的值
            var xml = new XMLHttpRequest();                 //定义一个XMLHttpRequest
            //GET传值
            //xml.open("GET", "/Ajax/Selete?Name=" + userName, true);
            //xml.send();
            xml.open("POST", "/Ajax/Selete", true);         //初始化一个求（请求的方式，请求的地址，是否异步）
            xml.setRequestHeader("Content-type","application/x-www-form-urlencoded")
            xml.send("Name=" + userName);                   //传值到服务器去（控制器）
            xml.onreadystatechange = function () {          获取控制器传过来的值
                if (xml.readyState == 4 && xml.status == 200) {
                    
                    var res = xml.responseText;

                    if (res == "*此用户已被使用") {
                        $("#dd").addClass("bb");

                    }
                    else {
                        $("#dd").removeClass("bb");
                    }
                    $("#dd").html(res);
                }

            }
        });
    </script>
    
    }

控制器

// GET: Ajax
        public ActionResult Index()
        {
            return View();
        }

        public ActionResult Selete(string Name)
        {
            var res = "此用户合法";
            string[] user = new string[] { "aa", "bb", "cc" };
            for (int i = 0; i < user.Length; i++)
            {
                if (user[i].ToString() == Name)
                {
                    res = "*此用户已被使用";
                    break;
                }
                else
                {
                    res = "此用户合法";                                  
                }
            }

            return Content(res);
        }