全新UI简易漂流瓶系统源码

---

一、详细介绍

全新UI简易漂流瓶系统源码

更新日志：

✔ 功能优化：新增「自己不能捡到自己瓶子」的防误触机制

✔ 交互升级：优化页面细节，操作体验更流畅

即将上线
✨ 回复功能开发中
✨ 次数限制方案：普通用户每日扔捡3次，VIP无限制。

安装说明：
1.修改数据库信息logincheck.php，config.php两处。
2.导入sql数据库文件

这个程序我是准备对接论坛用户的，所以里面获取的用户名是对接的论坛用户表

需要先安装一下hadsky论坛程序，或者你可以自己写一个用户表。

二、效果展示

1.部分代码

代码如下（示例）：

async function pickBottle() {
            try {
                const response = await fetch(`${API_URL}?type=2`);
                const text = await response.text();
                showResult(text);
            } catch (error) {
                console.error("Error:", error);
                showResult(`请求失败: ${error.message}`, true);
            }
        }

        async function viewAllBottles() {
            try {
                const response = await fetch(`${API_URL}?type=4`);
                const text = await response.text();
                showResult(text);
            } catch (error) {
                console.error("Error:", error);
                showResult(`请求失败: ${error.message}`, true);
            }
        }

        async function replyBottle() {
            const replyContent = document.getElementById("replyContent").value.trim();

            if (!replyContent) {
                showResult("请输入回复内容", true);
                document.getElementById("replyContent").focus();
                return;
            }

            if (!currentBottleId) {
                showResult("请先捡一个漂流瓶", true);
                return;
            }

            try {
                const response = await fetch(`${API_URL}?action=reply&bottle_id=${currentBottleId}&reply_content=${encodeURIComponent(replyContent)}`);
                const text = await response.text();
                showResult(text);
                document.getElementById("replyContent").value = "";
            } catch (error) {
                console.error("Error:", error);
                showResult(`请求失败: ${error.message}`, true);
            }
        }

2.效果图展示

---

三、学习资料下载

蓝奏云：https://qumaw.lanzoul.com/ii5JO2svzqra