如何使用 Javascript 延迟文本框的可见性，然后在第一个框可见后隐藏另一个框答案

【问题标题】：How do I use Javascript to delay visibility of a text box and then hide another box after the first becomes visible如何使用 Javascript 延迟文本框的可见性，然后在第一个框可见后隐藏另一个框
【发布时间】：2022-06-09 20:54:58
【问题描述】：

我对此很陌生，并且已经查看了与此问题类似的其他帖子。但是，我发现这些解决方案对我不起作用。

背景：我在 Wix 的 Velo Javascript 平台上工作。（如果这里的技术术语不正确，请原谅我）

我的目标：当我的网站主页加载时，我希望页面上的一个文本框 (#text45) 直到 5 秒后才可见。然后，当框#text45 可见时，我希望另一个普通框（#box2）变为隐藏。

我找到了一些类似下面的示例：（并非所有代码都已粘贴，我意识到像 div1 这样的一些元素需要更改为我的特定元素名称）

document.getElementById(\"div1\").style.visibility = \"visible\"; }

setTimeout(\"showIt()\", 5000);

但是，我收到错误代码：找不到名称 \'document\'。您需要更改目标库吗？尝试更改 \'lib\' 编译器选项以包含 \'dom\'。

在研究这个时，我发现 Velo 无法访问 dom，并且只能通过 \"$w\" 访问元素。

有人会善意地让我在如何实现上述“目标”方面朝着正确的方向前进吗？我真的很感激！先感谢您。

setTimeout 是一个开始

标签： javascript velo

【解决方案1】：

下面是你将如何做到的。请注意，将元素的 ID 更改为更具描述性的名称是一种很好的做法，但我坚持使用您在问题中提供的名称。

首先使用“属性和事件”面板将#text45 设置为隐藏。

然后使用此代码（请注意，您的页面可能已经有一个 onReady。如果它在那里并且您还没有使用它，请删除页面上的所有代码并用它替换它）：

$w.onReady( () => {
    setTimeout(() => {
        $w('#text45').show();
        $w('#box2').hide();
    }, 5000)    
} );

【讨论】：