0

注意:我不是开发人员。更像是一个业余爱好者(阅读 n00b)。我已经尝试寻找这个问题的答案,但到目前为止还没有找到任何可以为这个特定场景提供答案的东西。

我知道这是相对基本的,但是我正在尝试创建一个包含三个隐藏元素的页面,这些元素在时间延迟或鼠标单击后会显示出来。我正在努力让所有三个元素在同一页面上运行。

必需:
元素 1:页面加载后 10 秒显示隐藏图像
元素 2:页面加载后 10 分钟显示隐藏 div元素 3:元素 2 内
的 按钮图像,单击时显示另一个隐藏 div

我正在使用以下 setTimeout 函数来显示元素 1,但在此之后我无法运行第二个 setTimeout 命令。

<script language="javascript" type="text/javascript">
var pop=10;
function showIt() {
document.getElementById("hid").style.display = "block";
}
setTimeout(showIt, 10000);
</script>

我尝试为将元素 ID 更改为“hid2”的第二个元素重复此代码,但它不会运行。我是否需要使用 cleartimeout 函数来结束第一个 settimeout?

然后,我需要元素 3 的一些代码在元素 2 之后通过鼠标单击运行。

让 JS 的所有三个部分完美地结合在一起似乎超出了我的范围。您的帮助将不胜感激!

4

1 回答 1

0

我相信这就是你所要求的。

<img id="hid" src="img/darkred.jpg" style="width: 20px; display: none;"/>
<div id="hid2" style="display: none;">div 2
    <input type="button" value="show div3"/>
</div>
<div id="hid3" style="display: none;">div 3</div>


function showIt(hid) {
    document.getElementById(hid).style.display = "block";
}

function revealEl(id, delay){
    setTimeout(function(){
        showIt(id);
    }, delay);
}

revealEl("hid", 4000);
revealEl("hid2", 6000);

$("#hid2 input"").on("click", function(){
    showIt("hid3");
});
于 2013-09-25T03:37:30.810 回答