29 lines
1.0 KiB
JavaScript
29 lines
1.0 KiB
JavaScript
// 任务：
|
|
// 1. 获取昵称输入框、目标文本域、阶段下拉框
|
|
// 2. 监听昵称和目标的 input 事件
|
|
// 3. 把输入内容实时渲染到右侧预览
|
|
// 4. 监听阶段下拉框的 change 事件
|
|
// 5. 更新阶段标签文字
|
|
const nickname = document.getElementById("nickname-input")
|
|
const goal = document.getElementById("goal-input")
|
|
const stage = document.getElementById("stage-select")
|
|
|
|
nickname.addEventListener("input", function () {
|
|
const previewName = document.getElementById("preview-name")
|
|
previewName.textContent = nickname.value
|
|
if (!nickname.value.trim()) {
|
|
previewName.textContent = "未填写昵称"
|
|
}
|
|
})
|
|
goal.addEventListener("input", function () {
|
|
const previewGoal = document.getElementById("preview-goal")
|
|
previewGoal.textContent = goal.value
|
|
if (!goal.value.trim()) {
|
|
previewGoal.textContent = "这里会显示你的学习目标。"
|
|
}
|
|
})
|
|
|
|
stage.addEventListener("change", function () {
|
|
const previewStage = document.getElementById("preview-stage")
|
|
previewStage.textContent = stage.value
|
|
}) |