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

.net 一般处理程序代码如下：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data;
using System.Data.SqlClient;

namespace UI
{
    /// <summary>
    /// Login 的摘要说明
    /// </summary>
    public class Login : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";

            string userName = context.Request.Form["userName"]==null ?"":context.Request.Form["UserName"].ToString();
            string userPwd = context.Request.Form["UserPass"] == null ?"" : context.Request.Form["UserPass"].ToString();

            using (SqlConnection con = new SqlConnection("server =.;uid=sa;pwd=123;database=LT"))
            {
                using (SqlCommand cmd = new SqlCommand())
                {
                    string s = string.Format("select Count(1) cnt from users where userName ='{0}' and pwd='{1}'", userName, userPwd);
                    cmd.CommandText = s;
                    cmd.Connection = con;
                    con.Open();

                   int cnt = int.Parse( cmd.ExecuteScalar().ToString());

                    if (cnt == 1)
                    {
                        context.Response.Write(userName+userPwd+"登录成功"+s);

                    }
                    else
                    { context.Response.Write(userName+ userPwd + "登录失败"+s); }
                }
            }
                
                
           
                
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

View Code

一定要细心

但有时由于以前的习惯，只是细心是不能解决的，这个需要靠长时间的积累了~~

要多做、多写、多看。