本文介绍如何通过 javascript 在页面加载时自动执行搜索逻辑,确保 `quote-text` 表单默认隐藏,并仅当数据库中不存在匹配的实体名称时才显示,解决初始状态与交互状态不一致的问题。
要实现“页面加载时仅显示 entity-name 输入框,而 quote-form 默认隐藏”,关键在于:不仅响应用户输入(onkeyup),还需在 DOM 完全就绪后立即执行一次初始化检查。当前代码中 searchEntities() 仅由用户输入触发,因此页面首次加载时 #quote-form 仍保持 HTML 中的原始显示状态(默认为 block),导致不符合预期。
只需在脚本末尾添加 window.onload 或更现代的 DOMContentLoaded 事件监听器,确保 DOM 加载完成后再调用 searchEntities():
这样,页面首次加载即根据 entity-name 的当前值(通常为空)自动判断是否显示 quote-form,后续用户输入则实时响应,真正实现“所见即所得”的表单状态控制。