我编写了一段代码,可以在点击时显示问题,并在特定时间段内显示答案。当代码中没有 fadeOut 函数时,代码可以正常工作。一旦我使用了 fadeOut 函数,问题和答案就只显示一次。之后只显示问题。为什么会发生这种情况?
这是我的代码链接:http://jsfiddle.net/sagesony/6qDap/1058/
和代码
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<body>
<p>Question: <span id="question"></span></p>
<p>Answer: <span id="answer"></span></p>
<input id="start" type="button" value="start"/>
<input id="show" type="button" value="show answer"/>
<script>
document.getElementById("start").onclick=function(){
var i=Math.round(Math.random()*3);
var verbs=["play","run","go","kill"];
document.getElementById("question").innerHTML=verbs[i];
document.getElementById("show").onclick=function(){
var answers=["golf","dog","school","none"];
document.getElementById("answer").innerHTML=answers[i];
$("#answer").fadeOut(1000);
};
};
</script>
最佳答案
因为 fadeOut 正在将您的元素设置为 display:none;褪色后。 因此,您必须再次将此元素设置为可见以再次淡出。
只需使用:
.show()
执行此操作。
关于javascript - onclick 函数内的 fadeOut,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21602330/