56 lines
1.4 KiB
JavaScript
56 lines
1.4 KiB
JavaScript
// 获取页面元素
|
|
const resultEl = document.getElementById("result");
|
|
const copyBtn = document.getElementById("copyBtn");
|
|
const buttons = document.querySelectorAll(".buttons button");
|
|
|
|
/**
|
|
* 调用后端 API 生成随机内容
|
|
* @param {string} kind - 生成类型
|
|
*/
|
|
async function generate(kind) {
|
|
resultEl.textContent = "生成中...";
|
|
resultEl.style.color = "#fff";
|
|
|
|
try {
|
|
const res = await fetch(`/api/generate/${kind}`);
|
|
const data = await res.json();
|
|
|
|
if (data.error) {
|
|
resultEl.textContent = data.error;
|
|
return;
|
|
}
|
|
|
|
// 如果是颜色类型,直接展示色块
|
|
if (kind === "color") {
|
|
resultEl.textContent = data.result;
|
|
resultEl.style.color = data.result;
|
|
} else {
|
|
resultEl.textContent = data.result;
|
|
}
|
|
} catch (err) {
|
|
resultEl.textContent = "生成失败,请稍后重试";
|
|
console.error(err);
|
|
}
|
|
}
|
|
|
|
// 为每个按钮绑定点击事件
|
|
buttons.forEach((btn) => {
|
|
btn.addEventListener("click", () => {
|
|
generate(btn.dataset.kind);
|
|
});
|
|
});
|
|
|
|
// 复制结果到剪贴板
|
|
copyBtn.addEventListener("click", async () => {
|
|
const text = resultEl.textContent;
|
|
if (!text || text === "点击上方按钮开始生成") return;
|
|
|
|
try {
|
|
await navigator.clipboard.writeText(text);
|
|
copyBtn.textContent = "已复制 ✓";
|
|
setTimeout(() => (copyBtn.textContent = "复制结果"), 1500);
|
|
} catch (err) {
|
|
console.error("复制失败", err);
|
|
}
|
|
});
|