当前位置： 首页 > news >正文

表白墙项目（JAVA实现）

news 2026/3/27 12:47:55

1、在html里

class使用.

id使用#

2、记得引入响应依赖（举例lombok）

3、messageController

package com.example.demo.demos.web;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import java.util.ArrayList;
import java.util.List;
@RequestMapping("/message")
@RestController
public class massageController {//学过数据库的可以将这里改为数据库操作public List<MessageInfo> messageInfos=new ArrayList<>();//提交留言@RequestMapping("/publish")public boolean publishMessage(MessageInfo messageInfo){if(!StringUtils.hasLength(messageInfo.getMessage())||!StringUtils.hasLength(messageInfo.getTo())||!StringUtils.hasLength(messageInfo.getFrom())){return false;}//暂时存放在内存中messageInfos.add(messageInfo);return true;}@RequestMapping("/getlist")public List<MessageInfo> getlist(){return messageInfos;}
}

4、MessageInfo

package com.example.demo.demos.web;import lombok.Data;
import lombok.Getter;//可以省去我们的get和set方法，其他类可以直接调用
@Data
public class MessageInfo {private String from;private String to;private  String message;
}

5、messagewall前端代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>留言板</title><style>.container {width: 350px;height: 300px;margin: 0 auto;/* border: 1px black solid; */text-align: center;}.grey {color: grey;}.container .row {width: 350px;height: 40px;display: flex;justify-content: space-between;align-items: center;}.container .row input {width: 260px;height: 30px;}#submit {width: 350px;height: 40px;background-color: orange;color: white;border: none;margin: 10px;border-radius: 5px;font-size: 20px;}</style>
</head><body>
<div class="container"><h1>留言板</h1><p class="grey">输入后点击提交, 会将信息显示下方空白处</p><div class="row"><span>谁:</span> <input type="text" name="" id="from"></div><div class="row"><span>对谁:</span> <input type="text" name="" id="to"></div><div class="row"><span>说什么:</span> <input type="text" name="" id="say"></div><input type="button" value="提交" id="submit" onclick="submit()"><!-- <div>A 对 B 说: hello</div> -->
</div><script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script>//页面加载后信息留在页面上$.ajax({type:"get",url:"/message/getlist",success:function(messages){for(var message of messages){var html="<div>"+message.from+"对 "+message.to+" 说: "+message.message+"</div> "$(".container").append(html);}}});function submit(){//1. 获取留言的内容var from = $('#from').val();var to = $('#to').val();var say = $('#say').val();if (from== '' || to == '' || say == '') {return;}$.ajax({type:"post",url:"/message/publish",data:{from:from,to:to,message:say},success:function(result){if(result==true){//添加成功//2. 构造节点var divE = "<div>"+from +"对" + to + "说:" + say+"</div>";//3. 把节点添加到页面上$(".container").append(divE);//4. 清空输入框的值$('#from').val("");$('#to').val("");$('#say').val("");}else{//弹一个框alert("发表失败")}}});}</script>
</body></html>

6、前端代码中涉及到的后端代码部分说明

（1）前端获取留言内容部分

（2）防止页面刷新之后我们上次写的话消失，我们对其进行一下保存

7、效果展示

相关文章：

表白墙项目（JAVA实现）

1、在html里 class使用. id使用# 2、记得引入响应依赖&#xff08;举例lombok&#xff09; 3、messageController package com.example.demo.demos.web; import org.springframework.util.StringUtils; import org.springframework.web.bind.annotation.RequestMapping; i…...

编程日记 2024/4/2 18:00:19

openGauss 高级分析函数支持

高级分析函数支持 可获得性 本特性自openGauss 1.1.0版本开始引入。 特性简介 无。 客户价值 我们提供窗口函数来进行数据高级分析处理。窗口函数将一个表中的数据进行预先分组&#xff0c;每一行属于一个特定的组&#xff0c;然后在这个组上进行一系列的关联分析计算。这…...

编程日记 2024/4/2 17:59:18

【Java面试题系列】基础篇

目录 基本常识标识符的命名规则八种基本数据类型的大小&#xff0c;以及他们的封装类3*0.10.3返回值是什么short s1 1; s1 s1 1;有什么错? short s1 1; s1 1;有什么错?简述&&与&的区别&#xff1f;简述break与continue、return的区别&#xff1f;Arrays类的…...

编程日记 2024/4/2 17:58:17

Ubuntu 23.04 安装es

在Ubuntu 23.04上安装Elasticsearch的过程可能与之前版本类似&#xff0c;以下是基于最新稳定版Elasticsearch的一般安装步骤&#xff1a; 准备工作&#xff1a; 确保系统已更新至最新版本&#xff1a; sudo apt update && sudo apt upgrade安装Java Development Kit (…...

编程日记 2024/4/2 17:56:14

gradle 7.0 + 配置

Maven 镜像地址的设置 原来在项目根目录的 build.gradle 中进行设置&#xff0c;但是现在里面只有plugins。 工程的build.gradle的dependencies修改为plugins&#xff0c;替代了引用原来的Gradle版本。 // Top-level build file where you can add configuration options com…...

编程日记 2024/4/2 17:55:13

vue3的ref和reactive对比

一&#xff0c;ref 作用: 定义一个 ref 响应式的数据语法: const xxx ref(initValue) 用法 创建一个包含响应式数据的引用对象&#xff08;reference对象&#xff0c;简称ref对象&#xff09;。 JS中操作数据&#xff1a; xxx.value 模板中读取数据: 不需要.value&#xff0…...

编程日记 2024/4/2 17:53:11

是否应该升级到ChatGPT 4.0？深度对比ChatGPT 3.5与4.0的差异

如果只是想简单地体验AI的魅力&#xff0c;感受大模型的独特之处&#xff0c;或是玩一玩文字游戏&#xff0c;那么升级至ChatGPT 4.0可能并非必需。然而&#xff0c;若你期望将AI作为提升工作学习效率的得力助手&#xff0c;那么我强烈建议你升级到ChatGPT 4.0。 如果你不知道…...

编程日记 2024/4/2 17:52:09

C++刷题篇——04找等值元素

一、题目 二、解题思路 1、分割后放进二维数组 2、使用map&#xff0c;key为数值&#xff0c;value为其坐标 3、遍历二维数组元素&#xff0c;再在map中找该元素对应的value值&#xff08;二维数组形式&#xff09;&#xff0c;倘若value.size为1&#xff0c;那直接返回-1&…...

编程日记 2024/4/2 17:51:07

2024年最新服装erp软件排名！（建议收藏）

随着数字经济时代的到来&#xff0c;传统服装生产企业正在经历深刻的变革。如何实现产业数字化升级&#xff0c;是众多服装企业面临的共同课题。当前&#xff0c;服装类的企业管理软件已经成为企业实现智能化转型的关键。面对已经发生深刻改变的商业竞争环境&#xff0c;传统的…...

编程日记 2024/4/2 17:49:05

Radash一款JavaScript最新的实用工具库，Lodash的平替！

文章目录 Lodash 的痛点进入正题--Radash特点 举例几个常用的api 一说lodash应该大部分前端同学都知道吧&#xff0c;陪伴我们好多年的JavaScript工具库&#xff0c;但是自从 ES6 出现后就慢慢退出前端人的视线&#xff0c;能ES6写的代码绝对不会用Lodash&#xff0c;也不是完全…...

编程日记 2024/4/2 17:43:59

使用node爬取视频网站里《龙珠》m3u8视频

1. 找到视频播放网站 百度一下 龙珠视频播放 精挑细选一个可以播放的网站。 如&#xff1a;我在网上随便找了一个播放网站&#xff0c;可以直接在线播放 https://www.xxx.com/play/39999-1-7.html 这里不具体写视频地址了&#xff0c;大家可以自行搜索 2.分析网页DOM结…...

编程日记 2024/4/2 17:41:57

搜索与图论——Prim算法求最小生成树

在最小生成树问题里&#xff0c;正边和负边都没问题 朴素版prim算法 时间复杂度O(n^2) 生成树&#xff1a;每一次选中的t点&#xff0c;它和集合的距离对应的那条边&#xff0c;就是生成树的一条边 算法流程和dijkstra算法非常相似 #include<iostream> #include<cs…...

编程日记 2024/4/2 17:40:56

sqlmap基础知识

一、sqlmap简介 sqlmap是一个开源的渗透测试工具&#xff0c;可以自动检测和利用SQL注入漏洞以及接管数据库服务器的过程。 官网&#xff1a; sqlmap.org 核心功能 漏洞检测漏洞利用 学习关键点 基于sqlmap进行sql注入漏洞的检测&#xff0c;注入利用和攻击基于sqlmap进…...

编程日记 2024/4/2 17:39:55

读《C Primer Plus》

1、汇编语言是为特殊的中央处理单元设计的一系列内部指令&#xff0c;使用助记符来表示&#xff1b;不同的CPU系列使用不同的汇编语言。 2、C语言充分利用计算机优势&#xff0c;使它具有汇编语言才有的微调控能力&#xff0c;可移植性极好。 3、C语言可以访问硬件、操作内存…...

编程日记 2024/4/2 17:37:52

深入理解计算机系统 家庭作业 2.66

/* 前置条件:无符号整数右移不产生1 调用函数是为了可以查看整个过程,不影响结果. 思路是让x在右移的过程中,把最高位之前的位全部填满. 填满后的结果右移一位(即x的最高位变为0,其他为1),再异或x得到最高位 以此类推知道覆盖到32位. */ #include <stdio.h> #inclu…...

编程日记 2024/4/2 17:33:48

【服务端】node.js详细的配置

&#x1f468;‍&#x1f4bb;个人主页&#xff1a;开发者-曼亿点 &#x1f468;‍&#x1f4bb; hallo 欢迎 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! &#x1f468;‍&#x1f4bb; 本文由 曼亿点 原创 &#x1f468;‍&#x1f4bb; 收录于专栏&#xff1a…...

编程日记 2024/4/2 17:32:47

二、CentOS基础配置（1.网络与包管理）

文章目录 二、基础配置操作1、网络管理&#xff08;配置静态地址并进行ssh远程连接&#xff09;&#xff08;1.&#xff09;静态地址配置&#xff08;2.&#xff09;IP配置注释&#xff08;3.&#xff09;配置SSH远程连接 2、包管理&#xff08;1.&#xff09;yum软件包管理器1…...

编程日记 2024/4/2 17:29:43

Golang基础-5

Go语言基础 介绍 基础 切片 切片声明 切片初始化 切片基础操作 多维切片 介绍 本文介绍Go语言中切片(slice)(切片声明、切片初始化、切片基础操作、多维切片)等相关知识。 基础 切片 切片&#xff08;slice&#xff09;是对数组的一个连续片段的引用&#xff0c;切…...

编程日记 2024/4/2 17:24:36

Mysql数据库：故障分析与配置优化

目录 前言 一、Mysql逻辑架构图 二、Mysql单实例常见故障 1、无法通过套接字连接到本地MySQL服务器 2、用户rootlocalhost访问被拒绝 3、远程连接数据库时连接很慢 4、无法打开以MYI结尾的索引文件 5、超出最大连接错误数量限制 6、连接过多 7、配置文件/etc/my.cnf权…...

编程日记 2024/4/2 17:23:35

常见的图像分析算法

图像分析算法是计算机视觉领域中的一个重要分支&#xff0c;它通过使用预先训练的人工智能模型从图像中提取和分析视觉信息。这些算法可以应用于多种场景&#xff0c;如物体识别、图像分类、图像增强、缺陷检测等。北京木奇移动技术有限公司&#xff0c;专业的软件外包开发公司…...

编程日记 2024/4/2 17:20:31

Simulink频域分析避坑指南：如何准确获取谐振频率（含MATLAB代码）

Simulink频域分析实战&#xff1a;谐振频率精准提取方法论与MATLAB实现 在控制系统设计与分析领域&#xff0c;频域特性是评估系统动态性能的核心指标之一。而谐振频率作为频域响应中的关键特征点&#xff0c;直接影响着系统的稳定性和响应速度。然而&#xff0c;许多工程师在使…...

编程新知 2026/3/27 12:02:20

SpringCloud Alibaba与Nacos版本不匹配？手把手教你解决‘Client not connected‘错误

SpringCloud Alibaba与Nacos版本兼容性实战&#xff1a;彻底解决Client not connected问题 微服务架构的复杂性往往隐藏在细节之中。当SpringCloud Alibaba项目启动时控制台突然抛出Client not connected, current status:STARTING的红色警告&#xff0c;不少开发者都会心头一紧…...

编程新知 2026/3/27 10:25:43

OpenClaw远程控制方案：通过nanobot实现安全外网访问

OpenClaw远程控制方案&#xff1a;通过nanobot实现安全外网访问 1. 为什么需要远程控制OpenClaw&#xff1f; 上周我需要出差三天&#xff0c;但电脑上运行的OpenClaw自动化任务突然报错。当时我面临两个选择&#xff1a;要么让任务中断三天&#xff0c;要么冒险把本地网关直…...

编程新知 2026/3/27 9:53:19

EmbeddingGemma-300m在Mathtype公式的语义理解中的应用

EmbeddingGemma-300m在Mathtype公式的语义理解中的应用 1. 引言 数学公式的语义理解一直是自然语言处理领域的挑战性任务。传统的文本嵌入模型在处理复杂的数学表达式时往往力不从心&#xff0c;无法准确捕捉公式背后的数学含义和逻辑关系。EmbeddingGemma-300m作为Google最新…...

编程新知 2026/3/27 9:47:09

不止于读写：在HC32F460上为FATFS和SDIO驱动添加调试信息与性能测试

HC32F460深度优化&#xff1a;FATFS与SDIO驱动的调试技巧与性能压测实战 当你的HC32F460开发板已经能够读取SD卡文件时&#xff0c;真正的挑战才刚刚开始。那些隐藏在初始化失败、数据错位、速度瓶颈背后的秘密&#xff0c;往往需要更精密的调试手段才能揭开。本文将带你超越基…...

编程新知 2026/3/27 8:56:46

Django 学习日记（补充1）| 彻底吃透：自定义 JWT 认证 + 全局登录中间件

大家好&#xff0c;这是我 Django 学习日记的第三篇。上一篇我们把路由、反向解析、DRF 自动路由、媒体文件、跨域全部讲明白了。今天我们进入整个项目最核心、最安全、最关键的部分&#xff1a;用户登录认证体系&#xff08;在进入视图前的一篇补充文章&#xff09;。本文将从…...

编程新知 2026/3/27 8:16:30

依托AI改写功能的五个实用技巧，论文重复率由30%快速降至合规

嘿&#xff0c;大家好&#xff01;我是AI菌。今天咱们来聊聊一个让无数学生头疼的问题&#xff1a;论文重复率飙到30%以上怎么办&#xff1f;别慌&#xff0c;我这就分享5个实用降重技巧&#xff0c;帮你一次搞定&#xff0c;轻松压到合格线以下。这些方法都是我亲身试验过的&a…...

编程新知 2026/3/27 7:46:15

Ubuntu16.04服务器上从零部署LaneNet车道线检测：Tusimple数据集处理全流程避坑指南

Ubuntu 16.04服务器部署LaneNet车道线检测全流程实战 在自动驾驶和智能交通系统中&#xff0c;车道线检测是一项基础而关键的技术。本文将详细介绍如何在Ubuntu 16.04服务器环境下&#xff0c;从零开始部署LaneNet车道线检测模型&#xff0c;并处理Tusimple数据集的全流程。不同…...

编程新知 2026/3/27 7:07:29

s2-pro效果展示：会议纪要转语音+重点语句强调式播报实录

s2-pro效果展示&#xff1a;会议纪要转语音重点语句强调式播报实录 1. 专业语音合成新体验 s2-pro作为Fish Audio开源的专业级语音合成模型镜像&#xff0c;正在重新定义文本转语音的标准。不同于常见的聊天式语音工具&#xff0c;它专注于提供高质量的语音合成服务&#xff…...

编程新知 2026/3/27 6:01:01

基于springboot美食分享平台设计与开发(源码+精品论文+答辩PPT等资料)

博主介绍&#xff1a;CSDN毕设辅导第一人、靠谱第一人、全网粉丝50W,csdn特邀作者、博客专家、腾讯云社区合作讲师、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交…...

编程新知 2026/3/27 5:38:55