#### 很容易理解 插入数据 到数据库 在使用 setInterval() 读取数据 显示在 页面中 好了 不废话 直接上代码 不会的 可以加我 微信 Jth11163
## 效果图片
![在这里插入图片描述](https://img-blog.csdnimg.cn/20181202151055277.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzIxMTk3ODM3,size_16,color_FFFFFF,t_70)


## WebForm + Jquer + Css 代码

```

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication15.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="jquery-3.3.1.js" ></script>
<style>
*{
list-style:none;
padding:0px;
margin:0px;
}
ul{
line-height:20px;
}
li{
padding-left:20px;
text-align:left;
margin-bottom:10px;
color:blue;
}
#form1{
width:500px;
height:550px;
margin:auto;
border:1px solid black;
}
.Box{
width:500px;
height:500px;
box-sizing:border-box;
border:1px solid black;
overflow:auto;
}
span{
color:#808080;
padding-left:15px;
font-size:13px;
}
p{
color:black; font-size:16px;
}
#Button1{
background-color:blue;
width:80px;
height:45px;
line-height:45px;
color:white;
font-size:15px;
text-align:center;
border:none;
border-radius:5px;
cursor:pointer;
}
#TextBox1{
width:399px;
height:50px;
}
</style>
<script> $(function () {
$('#TextBox1').focus();
//发送
function Send() {
$.ajax({
url: "Handler2.ashx",
data: { Content: $('#TextBox1').val() },
type: "POST",
success: function (data) { }
});
}
$('input').keypress(function (e) {
if (e.which == 13) {
Send();
$('#TextBox1').val("");
$('#TextBox1').focus();
}
});
setInterval(function () {
$.ajax({
url: "Handler1.ashx",
type: "POST",
success: function (data) {
$('.ul').children().remove();
$('.ul').append(data);
}
});
$('.Box').scrollTop($('.ul').outerHeight());
}, 1);
$('#Button1').click(function () {
Send();
$('#TextBox1').val("");
$('#TextBox1').focus();
})
})
</script>
</head>
<body>
<form autopostback="false" id="form1" runat="server">
<div class ="Box">
聊天 在线人数:<span id ="Count" runat="server"></span>
<ul class ="ul">
</ul>
</div>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<%--<asp:Button ID="Button1" AutoPostBack="false" runat="server" onclick="Button1_Click" Text="发送" />--%>
<span>
<input type="button" id ="Button1" value ="发送"/>
</span>
</form> </body>
</html>

```
# Ashx(一般处理程序) 代码
### 生成 随机名字
```

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data.SqlClient;
using System.Data; namespace WebApplication15
{
/// <summary>
/// Handler1 的摘要说明
/// </summary>
public class Handler1 : IHttpHandler
{
DBHelper Helper = new DBHelper();
//处理
List<string> ChatContent = new List<string>();
string[] Arr = new string[];
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string J = "";
string sql = "select * from Content order by SendTime Asc";
DataSet Ds = Helper.Data(sql);
if (Ds.Tables[].Rows != null)
{
foreach (DataRow Row in Ds.Tables[].Rows)
{ J += "<li>" + "<p>" + Row["UserName"].ToString() + "<span>" + Row["SendTime"].ToString() + "</span>" + "</P>" + Row["Content"].ToString() + "</li>"; }
}
context.Response.Write(J); Helper.Connection.Close();
}
public bool IsReusable
{
get
{
return false;
}
}
}
}

```
### 插入读取数据

```

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data.SqlClient;
using System.Data;
namespace WebApplication15
{
/// <summary>
/// Handler2 的摘要说明
/// </summary>
public class Handler2 : IHttpHandler
{
DBHelper H = new DBHelper();
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
string Cont = context.Request["Content"].ToString();
if (Cont != null)
{
Get(context,Cont);
}
}
public void Get(HttpContext context,string Cont)
{ string sql = "Insert Into Content values(@name,@time,@con)";
SqlParameter[] par = new SqlParameter[] {
new SqlParameter("@con", Cont),
new SqlParameter("@name", Global.Name_),
new SqlParameter("@time", DateTime.Now) };
H.QuerOne(sql, par, CommandType.Text);
} public bool IsReusable
{
get
{
return false;
}
}
}
}

```

原著 希望对你有所帮助 共同学习哈哈哈哈哈哈 啊哈哈哈

qq 2456314589

WebForm+一般处理程序+Ajax聊天的更多相关文章

  1. PHP+ajax聊天室源码!支持长轮循跟定时请求两种

      var lastID = "1";//声明上次取回的消息的ID var isposted = false; var mGetTime;//设置setTimeout的返回值 // ...

  2. webform 中使用ajax

    常用的方式有 js –> WebService  , js->*.ashx, js->WebAPI, js->MVC Controller->Action. 前两种就不说 ...

  3. WebForm页面使用Ajax

    AJAX:”Asynchronous JavaScript and XML” 中文意思:异步JavaScript和XML.指一种创建交互式网页应用的网页开发技术.AJAX并非缩写词,而是由Jesse ...

  4. 在webform中使用ajax

    如果你用过Asp.net webform, 说明你也算是.NET 开发的老兵了.WEBform应该是2011-2013左右,当时还用visual studio 2005. visual studio ...

  5. WebForm下的$.ajax中contentType: “application/json” 的用法

    不使用contentType: “application/json”则data可以是对象 $.ajax({ url: actionurl, type: "POST", datTyp ...

  6. 一般处理程序,ajax

    一般处理程序调用session: 在.aspx.cs页中读写Session都是Session["***"]就可以获取或者写入.但是在一般处理程序也就是ashx页面中,再这样写的话, ...

  7. Ajax聊天

    结构: index.html <!DOCTYPE html> <html> <head> <title>index.html</title> ...

  8. ASP.NET webform基于Jquery,AJAX的三级联动

    主要html代码 <select id="province"> <option value="0">--请选择省份--</opti ...

  9. Ajax PHP JavaScript MySQL实现简易的无刷新在线聊天室

    思路 消息显示区 发消息 板块 消息显示 消息发送 优化 显示非重复性的数据 优化显示 加上滚动条 每次都显示最新消息 完整代码 前端代码 数据库表结构 服务器端代码 总结与展望 总结 展望 为更好的 ...

随机推荐

  1. Linux上好用的工具集合

    1.截图工具 WIndows下有Snipaste,Ubuntu自带的截图工具不能涂鸦等,不好用.Linux下可以使用deepin-screenshot(深度截图,https://www.deepin. ...

  2. YAML基础教程

    一.YAML介绍YAML参考了其他多种语言,包括:XML.C语言.Python.Perl以及电子邮件格式RFC2822.Clark Evans在2001年5月在首次发表了这种语言,另外Ingy döt ...

  3. 基于JavaMail开发邮件发送器工具类

    基于JavaMail开发邮件发送器工具类 在开发当中肯定会碰到利用Java调用邮件服务器的服务发送邮件的情况,比如账号激活.找回密码等功能.本人之前也碰到多次这样需求,为此特意将功能封装成一个简单易用 ...

  4. 【STM32H7教程】第9章 STM32H7重要知识点数据类型,变量和堆栈

    完整教程下载地址:http://forum.armfly.com/forum.php?mod=viewthread&tid=86980 第9章   STM32H7重要知识点数据类型,变量和堆栈 ...

  5. 基于promise对小程序http请求方法封装

    原因是我不想每次请求都复制粘贴那么长的请求地址,所以我把前边那一坨请求地址作为基础地址,只传后台给的路由就ok,而且,并不是每次请求都要显示正在加载,这对小程序体验很差,所以,我加了个形参,用来判断是 ...

  6. Python与家国天下

    导读:Python猫是一只喵星来客,它爱地球的一切,特别爱优雅而无所不能的 Python.我是它的人类朋友豌豆花下猫,被授权润色与发表它的文章.如果你是第一次看到这个系列文章,那我强烈建议,请先看看它 ...

  7. Android新手引导库推荐

    本文同步至http://javaexception.com/archives/31 介绍一波新手引导层的库.都是star数挺高的一些库. 1.NewbieGuide(国内开发者开发) Android ...

  8. 章节十、7-Xpath---Xpath中绝对路径相对路径的区别

    以下演示操作以该网址中的内容为例:https://learn.letskodeit.com/?_ga=2.143454972.85111248.1555037144-697706367.1554889 ...

  9. 数据库概论_3标准化的SQL语言_ 数据定义

    Student: Course: SC: 1.数据库的定义.删除 1.1数据库的定义(创建) CREATE DATABASE student; 1.2数据库的删除 DROP DATABASE stud ...

  10. 爬虫框架之Scrapy(二)

    递归解析 糗事百科递归解析 在前面的例子里只是爬取了糗事百科热门的第一个页面,但是当我们需要爬取更多的页面时,需要对每个页面的url依次发起请求,然后通过解析的方法进行作者和标题的解析. 我们可以构建 ...