jQuery Ajax请求 .net 一般处理程序

初学ajax 一个简单的功能，调试了2个小时，代码如下虽然成功了但是有错误

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <meta charset="utf-8" />
    <link href="css/bootstrap.css" rel="stylesheet" />
    <script src="scripts/jquery-1.11.3.min.js"></script>

    <script>
        $(function () {
            $("#btnLogin").click(function () {

                if ($("#txtName").val() == "") {
                    alert("用户名不能为空");
                    return false;
                }

                $.ajax({ 
                    type: 'POST',
                    url: "Login.ashx",
                    data: { userName: $("txtName").val(), userPwd: $("txtPwd").val() },
                    success: function (data) {
                        alert(data);
                    },
                    datatype:Text
                })
            })
        })
    </script>
</head>
<body class="container">

    <div class="group">
        <label class="control-label">用户名</label>
        <input id="txtName" class="form-control" name="txtName" />

    </div>
    <div class="group">
        <label class="control-label">密码</label>
        <input id="txtPwd" class="form-control" name="txtPwd" />

    </div>

    <button id="btnLogin" class="btn-group" name="btnLogin">登录</button>
    <button id="btnReset" class="btn-group" name="btnReset">重置</button>
</body>
</html>

后台就是新建个一般处理程序 helloword

后来 dataType 换成 json 结果就不对了

在测试发现。。。json要用引号引起来

看文档

dataType

类型：String

预期服务器返回的数据类型。如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息来智能判断，比如 XML MIME 类型就被识别为 XML。在 1.4 中，JSON 就会生成一个 JavaScript 对象，而 script 则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后，传递给回调函数。可用值:

"xml": 返回 XML 文档，可用 jQuery 处理。
"html": 返回纯文本 HTML 信息；包含的 script 标签会在插入 dom 时执行。
"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了 "cache" 参数。注意：在远程请求时(不在同一个域下)，所有 POST 请求都将转为 GET 请求。（因为将使用 DOM 的 script标签来加载）
"json": 返回 JSON 数据。
"jsonp": JSONP 格式。使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。
"text": 返回纯文本字符串

字符串。。。字符串。。。字符串重要的事说三便也就是我前边的text也是错的虽然出来了正确的结果

再说第二个问题传过去后登录收不到值。。。。又检查。。。。$("txtName")少个#号。。这是一个id啊这是一个id

最后前台成这样了

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <meta charset="utf-8" />
    <link href="css/bootstrap.css" rel="stylesheet" />
    <script src="scripts/jquery-1.11.3.min.js"></script>

    <script>
        $(function () {
            $("#btnLogin").click(function () {

                if ($("#txtName").val() == "") {
                    alert("用户名不能为空");
                    return false;
                }

                var username = $("#txtName").val();
                var userpwd =$("#txtPwd").val();

                //$.ajax({ 
                //    type: 'POST',
                //    url: "Login.ashx",
                //    data: {userName: $("txtName").val(),userPwd: $("txtPwd").val() },
                //    success: function (data) {
                //        alert(data);
                //    }
                //    //datatype:"json"
                //})

                alert(username+userpwd);
                

                $.post("Login.ashx", { UserName:username, UserPass:userpwd  }, function (result) {
                    alert(result);
                });

           
            })
        })
    </script>
</head>
<body class="container">

    <div class="group">
        <label class="control-label">用户名</label>
        <input id="txtName" class="form-control" name="txtName" />

    </div>
    <div class="group">
        <label class="control-label">密码</label>
        <input id="txtPwd" class="form-control" name="txtPwd" />

    </div>

    <button id="btnLogin" class="btn-group" name="btnLogin">登录</button>
    <button id="btnReset" class="btn-group" name="btnReset">重置</button>
</body>
</html>

View Code