Ajax之前后台简单交互---登录实现

第一步引入jquery.js

html代码如下

<form name="post" id="post" method="post" action="/Login">
       
        <input type="text" name="username" value="" />
        <input type="password" name="password" value="@Model.linkorig" />
        <input type="button" value="提交" onclick="Submit()">
    </form>

js如下

function Submit() {
        var username = $("#username").val();
        $.get("/Ajax/CheckName", { name: username },
           function (data) {
               if (!data.Success) {
                   alert(data.Msg);
                   return;
               } else {
                   document.post.submit();
               }
           }
   , "json");
    }

 

后台如下

public JsonResult CheckName(string name)
{
JsonData _jsondata = new JsonData();
JsonResult jsn = new JsonResult();
jsn.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
//检查用户名是否存在代码---省略

//返回json
_jsondata.Success = false;

_jsondata.Msg = "用户名不存在!";
jsn.Data = _jsondata;
return jsn;
}