让文本链出现，并在相同的延迟上消失

如何使一条文本在5秒内出现，另一条文本在5秒内消失？我可以单独做任何一件事，但一起都不会有效。我已经发布了下面的代码。我试图重命名其中一个功能的一些功能，并保持其他相同，但没有工作，所以我解开了。让文本链出现，并在相同的延迟上消失

<script> 
// First strand of text 

window.onload = function(){ 
    var theDelay = 5; 
    var timer = setTimeout("showText()",theDelay*1000) 
} 
function showText(){ 
    document.getElementById("delayedText").style.visibility = "visible"; 
} 
</script> 
</head> 
<body> 
<div id="delayedText" style="visibility:hidden"> 
This text will appear after 5 seconds 
</div> 

<script> 
// Second strand of text 

window.onload = function(){ 
    var theDelay = 5; 
    var timer = setTimeout("showText()",theDelay*1000) 
} 
function showText(){ 
    document.getElementById("delayedText").style.visibility = "hidden"; 
} 
</script> 
</head> 
<body> 
<div id="delayedText" style="visibility:visible"> 
This text will disappear after 5 seconds 
</div>

来源

2014-04-30 Thomas

您的代码有几个问题。你打电话window.onload两次，这是不必要的。您应该捆绑所有功能并在window.onload内调用它们。其次，要隐藏和显示的两个元素都具有“delayedText”的ID，这意味着两个不同的函数（一个隐藏，一个显示）同时作用于相同的对象，并取消彼此。

对象ID是唯一的。创建两个具有唯一ID的对象，并在同一个函数中调用它们。

// Set the timer 
var theDelay = 5; 
function timer() { 
    setTimeout(function(){ 
     toggleText();  
    }, theDelay * 1000); 
} 
// Call the timer 
timer(); 

// Toggle visibility 
function toggleText() { 
    document.getElementById("toShow").style.visibility = "visible"; 
    document.getElementById("toHide").style.visibility = "hidden"; 
}

JS小提琴：http://jsfiddle.net/URfk5/1/

来源

2014-04-30 01:49:28 printr

让文本链出现，并在相同的延迟上消失

回答

相关问题