From f090f18a9de65ba9c576998d963b40ad442eaa7e Mon Sep 17 00:00:00 2001
From: ZF sun <34314687@qq.com>
Date: Fri, 15 May 2026 15:14:11 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20inputs-config.js=20=E5=90=88?=
=?UTF-8?q?=E5=B9=B6=E4=B8=BA=20config.js=EF=BC=8C=E6=96=B0=E5=A2=9E?=
=?UTF-8?q?=E9=BB=98=E8=AE=A4=E8=83=8C=E6=99=AF=E5=9B=BE=E9=85=8D=E7=BD=AE?=
=?UTF-8?q?=E5=8F=8A=E4=BD=BF=E7=94=A8=E8=AF=B4=E6=98=8E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
index.html | 2 +-
js/{inputs-config.js => config.js} | 14 ++-
js/script.js | 4 +-
使用说明.md | 152 +++++++++++++++++++++++++++++
4 files changed, 166 insertions(+), 6 deletions(-)
rename js/{inputs-config.js => config.js} (50%)
create mode 100644 使用说明.md
diff --git a/index.html b/index.html
index d9c91a7..7f7f5cc 100644
--- a/index.html
+++ b/index.html
@@ -176,7 +176,7 @@
-
+
diff --git a/js/inputs-config.js b/js/config.js
similarity index 50%
rename from js/inputs-config.js
rename to js/config.js
index d94da14..e65b5e7 100644
--- a/js/inputs-config.js
+++ b/js/config.js
@@ -1,5 +1,13 @@
-// 输入框初始化配置 - 独立于主逻辑的配置文件
-// 如需调整初始化位置或样式，请修改此文件
+// ============================================
+// 邀请函制作工具 - 全局配置文件
+// 修改以下数值即可调整外观，无需改动代码
+// ============================================
+
+// -------- 默认背景图 --------
+// 修改为你的图片路径即可替换默认背景
+var DEFAULT_BG_IMAGE = './images/default-bg.jpg';
+
+// -------- 三个预设输入框的初始位置与样式 --------
var INPUTS_CONFIG = {
"inputs": [
{
@@ -22,7 +30,7 @@ var INPUTS_CONFIG = {
"id": "input3",
"label": "编号",
"left": 100,
- "top": 306.4,
+ "top": 308.1,
"fontWeight": 700,
"placeholder": "请输入"
}
diff --git a/js/script.js b/js/script.js
index b347203..4697eee 100644
--- a/js/script.js
+++ b/js/script.js
@@ -804,9 +804,9 @@
}
}
- // 加载默认背景图
+ // 加载默认背景图（路径从 config.js 读取）
function loadDefaultBackground() {
- const defaultBgUrl = './images/default-bg.jpg';
+ const defaultBgUrl = typeof DEFAULT_BG_IMAGE !== 'undefined' ? DEFAULT_BG_IMAGE : './images/default-bg.jpg';
const img = new Image();
img.onload = () => {
currentImage = img;
diff --git a/使用说明.md b/使用说明.md
new file mode 100644
index 0000000..d78b158
--- /dev/null
+++ b/使用说明.md
@@ -0,0 +1,152 @@
+# 邀请函制作工具 - 使用与配置说明
+
+> 以下操作，只需要用记事本打开文件、修改几个数字即可。
+
+---
+
+## 一、调整三个输入框的位置
+
+### 适用场景
+
+打开页面后，输入框（企业、嘉宾、编号）的位置不满意，想上下左右调一调。
+
+### 操作步骤
+
+1. 用 **记事本** 打开 `js/config.js` 文件
+
+2. 找到下半部分的 `INPUTS_CONFIG` 配置段：
+
+```js
+var INPUTS_CONFIG = {
+ "inputs": [
+ {
+ "id": "input1", // ← 第一个输入框（企业）
+ "left": 100, // ← 距离左边多少像素
+ "top": 218.4 // ← 距离顶部多少像素
+ },
+ {
+ "id": "input2", // ← 第二个输入框（嘉宾）
+ "left": 100,
+ "top": 261.4
+ },
+ {
+ "id": "input3", // ← 第三个输入框（编号）
+ "left": 100,
+ "top": 308.1
+ }
+ ]
+};
+```
+
+3. **修改数字即可**：
+
+ - **`left`**：数字越大，输入框越靠右；数字越小，越靠左
+ - **`top`**：数字越大，输入框越靠下；数字越小，越靠上
+
+ > 小技巧：在页面上选中输入框，会显示它的坐标，复制数字填进来即可。
+
+4. **保存文件**，然后刷新页面，效果就会生效。
+
+---
+
+## 二、更换默认背景图片
+
+### 适用场景
+
+打开页面时自动显示的那张背景图想换成自己的图片。
+
+### 操作步骤
+
+**方法一（推荐）—— 替换图片文件：**
+
+1. 准备一张你想要的图片（建议用 JPG 格式）
+2. 把图片放到 `images` 文件夹里，重命名为 `default-bg.jpg`
+ > 如果原来有一张，会提示"替换文件"，点击确定即可。
+3. 刷新页面，新背景图就会自动加载
+
+**方法二—— 修改配置文件路径：**
+
+1. 把你的图片放到 `images` 文件夹，比如命名为 `my-bg.png`
+2. 用记事本打开 `js/config.js`
+3. 找到文件开头的这一行：
+
+```js
+var DEFAULT_BG_IMAGE = './images/default-bg.jpg';
+```
+
+4. 改成你的图片路径：
+
+```js
+var DEFAULT_BG_IMAGE = './images/my-bg.png';
+```
+
+5. 保存文件，刷新页面
+
+---
+
+## 三、修改输入框的文字粗细
+
+### 适用场景
+
+想让输入框的文字更粗或更细。
+
+### 操作步骤
+
+1. 用记事本打开 `js/config.js`
+
+2. 找到 `"fontWeight": 700` 这一行
+
+3. 修改数字（范围 400 ~ 900）：
+
+| 数值 | 效果 |
+|------|------|
+| 400 | 正常粗细 |
+| 500 | 中等 |
+| 600 | 半粗 |
+| **700** | **加粗（默认）** |
+| 800 | 更粗 |
+| 900 | 最粗 |
+
+4. 保存文件，刷新页面
+
+---
+
+## 四、修改输入框的占位提示文字
+
+### 适用场景
+
+想把"请输入"改成其他提示语。
+
+### 操作步骤
+
+1. 用记事本打开 `js/config.js`
+
+2. 找到相应的 `"placeholder"` 行，例如：
+
+```js
+"placeholder": "请输入"
+```
+
+3. 改成你想要的文字，比如：
+
+```js
+"placeholder": "在此输入企业名称"
+```
+
+4. 保存文件，刷新页面
+
+---
+
+## 常见问题
+
+**Q：修改文件后页面没变化？**
+A：先确认文件已保存，然后刷新浏览器页面（按 F5 或点浏览器的刷新按钮）。
+
+**Q：改坏了怎么办？**
+A：可以重新下载项目，或者联系开发者恢复。
+
+**Q：找不到 `images` 文件夹？**
+A：项目文件夹里如果没看到，自己新建一个名叫 `images` 的文件夹即可。
+
+**Q：`config.js` 在哪里？**
+A：在 `js` 文件夹里，打开后一眼就能看到全部配置项。