使用相同的Inline1中的CountDown从CountDown跳到CountDown
使用相同的Inline1中的CountDown从CountDown跳到CountDown
提问于 2015-02-18 05:09:54
我有一个第一个内联表，有3秒倒计时，当它达到0(0)时，我想自己加载第二个内联块。当计数器=== 0。
这是一个游戏，你有3秒来选择每个区块的答案，你要么点击，要么让游戏带你下一个区块，一旦计时器达到零。
如果点击链接，它确实带我到第二个街区。问题是将倒计时和过渡到第二或第三块本身。
我试过几件事，但都没有成功。知道怎么修正我的代码吗？我会非常感激的。希望这有意义。
HTML：
<button class='inline' href="#Set1" onclick="CountDown()">Start here...</button>
<div style='display:none'>
<div id='GameSet1'>
<table width="100%">
<tr>
<td>
<a class="Set2" href="#">Click here to open 2nd Set</a>
</td>
<td>
<b>Time left: <div id="count1">3</div></b>
</td>
</tr>
</table>
</div>
</div>
<div style='display:none'>
<div id='GameSet2'>
<table width="100%">
<tr>
<td>
<a class="SetN" href="#">Something else here</a>
</td>
<td>
<b>Time left: <div id="countN">3</div></b>
</td>
</tr>
</table>
</div>
</div>当(计数器=== 0)不工作时，在这里编码。
代码：(使用jQuery)
<script>
$(document).ready(function () {
$(".inline").colorbox({
inline: true,
width: "1000",
height: "850"
});
});
function CountDown() {
var counter = 3;
setInterval(function () {
counter--;
if (counter >= 0) {
span = document.getElementById("count1");
span.innerHTML = counter;
}
if (counter === 0) {
$(".Set2").colorbox({
inline:true,
href:"#GameSet2"
});
clearInterval(counter);
}, 1000);
}
</script>回答 1
Stack Overflow用户
回答已采纳
发布于 2015-02-19 04:24:26
据我所知，您有一组面板，并且希望每个面板显示3秒，除非单击链接。如果是这样的话，我有个解决办法。不幸的是，我的示例在jsFiddle中不起作用，因为所有东西都被一个函数包围。另外，我决定不使用jQuery，因为我以前从未使用过它，当我尝试使用颜色框时，它说它没有定义。
守则是：
</head>
<body>
<button onclick="start(this)" class="inline">Start Here</button>
<div style="display:none" id="Set1">
<table border="1">
<tr>
<td>
<a href="#" onclick="start(this)">Click here to open 2nd Set</a>
</td>
<td>
Time Left: <span id="Time1"></span>
</td>
</tr>
</table>
</div>
<div style="display:none" id="Set2">
<table border="1">
<tr>
<td>
<a href="#" onclick="done()">Something else here</a>
</td>
<td>
Time Left: <span id="Time2"></span>
</td>
</tr>
</table>
</div>
<script>
window.onload = function(){
//You could use colorbox here
/*
$(".inline").colorbox({
inline: true,
width: "1000",
height: "850"
});
*/
}
//This is the Question Number. It should start at zero.
num = 0
//This is a object where all the counters are going to be stored
count = {}
function Count(count,func,func2){
/*
This is an Object Constructor. This will hold all the timers and make
it easier to create and kill a timer. The instanses will also hold the
data of the timer.
*/
this.count = count
thisParent = this
this.kill = function(){
//This is a function for stopping the timer
clearInterval(thisParent.counter)
if(func2 != undefined){
//Calls the function when the timer ends.
//The function was passed in as a argument
func2()
}
}
function oneCount(){
//This function is executed every second
//This function is passed in as an argument and is called every second.
//The Parent Object is passed into it as the argument
func(thisParent)
//Decrements count
thisParent.count -= 1
//Stops timer at zero
if(thisParent.count < 0){
thisParent.kill()
}
}
//This executes it once to prevent delay
oneCount()
//The counter is stored in ObjectInstance.counter
this.counter = setInterval(oneCount,1000)
}
function start(el){
num += 1
max = 2
element = document.getElementById("Set"+String(num))
element.style.display = "block"
if(num == 1){
el.style.display = "none"
}else{
document.getElementById("Set"+String(num-1)).style.display = "none"
count[num-1].kill()
}
element2 = document.getElementById("Time"+num.toString())
function CountFunction(o,el){
el.innerHTML = o.count
}
function End(){
if(num<max){
start(num+1)
}
}
count[num] = new Count(3,function(n){CountFunction(n,element2)},End)
}
function done(){
alert("That Was The Last Question")
}
</script>
<body>
<html>URL在这里：
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28576394
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号