Question

我有这段代码：

function divHideShow(divToHideOrShow) 
{
    var div = document.getElementById(divToHideOrShow);

    if (div.style.display == "none") 
    {
        div.style.display = "block";
    }
    else 
    {
        div.style.display = "none";
    }

}

执行div.style.display =“block”时如何让它等待2秒; ？

由于

Answer 1

在运行某些代码之前，您可以使用函数setTimeout等待指定的时间（以毫秒为单位）。

function divHideShow(divToHideOrShow) 
{
    var div = document.getElementById(divToHideOrShow);

    if (div.style.display == "none") 
    {
        setTimeout(function () {
            div.style.display = "block";
        }, 2000);
    }
    else 
    {
        div.style.display = "none";
    }

}

可能值得考虑添加和删除类而不是直接设置样式。然后，您可以使用CSS处理所有样式，这有助于维护（并且您可以使用CSS3动画来淡入/增大/缩小内容和内容）。

Answer 2

这回答了你的问题：setTimeout的第二个参数需要几毫秒，2000 milliseconds= 2 seconds

function divHideShow(divToHideOrShow) 
{
    var div = document.getElementById(divToHideOrShow);

    if (div.style.display == "none") 
    {
        setTimeout(function(){div.style.display = "block";},2000);

    }
    else 
    {
        div.style.display = "none";
    }

}

如果您需要fadeIn或fadeOut效果，最好考虑使用jquery库：

您需要包含jquery库才能使其正常工作.....

function divHideShow(divToHideOrShow) 
{

     var time=600;  //milli seconds alter this for changing speed
     $("#"+divToHideOrShow).fadeToggle(time);

}

函数内的超时（javascript）

2 个答案: