情感交流篇:HTML页面如何与后端联系

通过ajax

get方法:

  基本格式:$.get("后台一般处理程序文件路径",{传值,格式为  KEY:VULES},function(后台返回值){接到后台数据后处理});

1 $.get("Ajax/ToBeAssigned.ashx?" + Math.random(5000), { Action: "Update", StudyNo: studyno, ExamNo: examno, DeptCode: DeptCode }, function(data) {
2                 if (data != null) {
3                     if (data == 1) {
4                         $("#tow").append("<tr style='border: 0px;background:#FFFFFF'><td colspan='7' style='border: 0px;'><label style='color: #FF0000;'>关联成功!</label></td></tr>");
5                     } else {
6                         $("#tow").append("<tr style='border: 0px;background:#FFFFFF'><td colspan='7' style='border: 0px;'><label style='color: #FF0000;'>关联失败!</label></td></tr>");
7                     }
8                 }
9             });

①后台获取前台出入的值,用  context.Request["KEY"]; 

②后台处理(包括对数据库的增删改查)

③后台输出给前台,用context.Response.Write(result);

post方法:

  基本格式:同get方法

①后台获取前台出入的值,用  context.Request.Form["KEY"]; 

②后台处理(包括对数据库的增删改查)

③后台输出给前台,用context.Response.Write(result);

 1 function ShowRegBox() {
 2     layer.open({
 3         type: 1,
 4         title: "注册",
 5         area: ["400px", "490px"],
 6         content: $("#regbox")
 7     });
 8 }
 9 
10 function Reg()
11 {
12     var username = $("#txtRegUserName").val();
13     var pwd = $.md5($("#txtRegPwd").val());
14     var qq = $("#txtRegQQ").val();
15     var email = $("#txtRegEmail").val();
16     var tel = $("#txtRegTel").val();
17     if (username == "" || pwd == "") {
18         layer.msg("用户名密码不能为空!", { title: "提示", icon: 5 });
19     }
20     else {
21         $.post("/demo.ashx", { "username": username, "pwd": pwd, "qq": qq, "email": email, "tel": tel, "cmd": "reg" }, function (data) {
22             if(data=="注册成功")
23             {
24                 layer.msg(data, {
25                     icon:6
26                 });
27             }
28             else
29             {
30                 layer.msg(data, {
31                     icon: 5
32                 });
33             }
34         });
35     }
36 }

后台处理:

  1 using System;
  2 using System.Collections.Generic;
  3 using System.Data;
  4 using System.Data.SqlClient;
  5 using System.Linq;
  6 using System.Web;
  7 
  8 namespace PROJECT20160712
  9 {
 10     /// <summary>
 11     /// demo 的摘要说明
 12     /// </summary>
 13     public class demo : IHttpHandler
 14     {
 15         public HttpContext context;
 16         public string strResult = "";
 17         public void ProcessRequest(HttpContext context)
 18         {
 19             this.context = context;
 20             string cmd=context.Request.Form["cmd"];
 21             switch(cmd)
 22             {
 23                 case"login":
 24                     strResult=LoginAjax();
 25                     break;
 26                 case "reg":
 27                     strResult = RegAjax();
 28                     break;
 29             }
 30             context.Response.Write(strResult);
 31         }
 32 
 33         public string RegAjax()
 34         {
 35             string username = context.Request.Form["username"];
 36             string pwd = context.Request.Form["pwd"];
 37             string qq = context.Request.Form["qq"];
 38             string email = context.Request.Form["email"];
 39             string tel = context.Request.Form["tel"];
 40 
 41             string strSql = string.Format("select * from login where username='{0}'", username);
 42             if (SqlHelper.Exists(strSql))
 43             {
 44                 return "该用户已经被注册";
 45             }
 46             else
 47             {
 48                 //string strSql1 = string.Format("insert into login values('{0}','{1}','{2}','{3}','{4}')", pwd, username, qq, email, tel);
 49                 string strSql1 = "insert into login values(@pwd,@username,@qq,@email,@tel)";
 50                 SqlParameter[] para1 = new SqlParameter[] 
 51                 { 
 52                     new SqlParameter("@pwd",SqlDbType.NVarChar), 
 53                     new SqlParameter("@username",SqlDbType.NVarChar) ,
 54                     new SqlParameter("@qq",SqlDbType.NVarChar), 
 55                     new SqlParameter("@email",SqlDbType.NVarChar) ,
 56                     new SqlParameter("@tel",SqlDbType.NVarChar) 
 57                 };
 58                 para1[0].Value = pwd;
 59                 para1[1].Value = username;
 60                 para1[2].Value = qq;
 61                 para1[3].Value = email;
 62                 para1[4].Value = tel;
 63                 if (SqlHelper.ExecteNonQueryText(strSql1, para1) > 0)
 64                 {
 65                     return "注册成功";
 66                 }
 67                 else
 68                 {
 69                     return "注册失败";
 70                 }
 71             }
 72         }
 73         public string LoginAjax()
 74         {
 75             //content上下文对象,包括下面2个方法
 76             //Request请求、Response响应
 77             string username = context.Request.Form["username"];
 78             string pwd = context.Request.Form["pwd"];
 79             //string strSql = string.Format("select * from Login where username='{0}' and pwd='{1}'", username, pwd);
 80             
 81             string strSql = "select * from Login where username=@username and pwd=@pwd";
 82             SqlParameter[] para = new SqlParameter[] 
 83             { 
 84                 new SqlParameter("@username",SqlDbType.NVarChar), 
 85                 new SqlParameter("@pwd",SqlDbType.NVarChar) 
 86             };
 87             para[0].Value = username;
 88             para[1].Value = pwd;
 89 
 90             if (SqlHelper.Exists(strSql))
 91             {
 92                 return "登录成功";
 93             }
 94             else
 95             {
 96                 return "登录帐号密码不匹配";
 97             }
 98         }
 99         public bool IsReusable
100         {
101             get
102             {
103                 return false;
104             }
105         }
106     }
107 }
原文地址:https://www.cnblogs.com/yinsheng/p/5680557.html