Question

我目前正在开发一个测验应用。简单的多选择测验，它工作正常，问题出现，倒计时开始..最后显示分数。现在我想为玩家添加一些“助推器”以增强游戏玩法，所以我开始使用“时间助推器”，这必须允许为玩家增加额外的时间，这里是计数器类：

<script type="application/javascript">
var myCountdownTest = new Countdown({
  time: 60, 
  width:200, 
  height:80, 
  rangeHi:"minute"
 });
 </script>

所以我添加了一个名为“添加时间！”的按钮

<button id='<?php echo $i;?>' class='time btn btn-success' type='button' >Add time!</button>

假设我想要一旦按下按钮，时间计数器得+20秒，所以我写道：

$(document).on('click','.time',function() {
  myCountdownTest.time=myCountdownTest.time+20;  
});

但这不起作用，我在这里缺少什么？ PS：我希望这个按钮只需点击一次，这样玩家就可以使用这个助推器，然后锁定按钮。

Answer 1

也许我错了，但我在这里：

$(document).on('click','.time',function(){
myCountdownTest.time=myCountdownTest.time+20;  
});

您正在将clik事件附加到整个文档中。尝试做同样的事情，但改为按钮：

$("#<?php echo $i; ?>").on('click','.time',function(){
myCountdownTest.time=myCountdownTest.time+20;  

$(this).unbind( "click" );
});

unbind行解除按钮上的clic事件并且不再可点击。

Answer 2

new Countdown的回复未公开time属性，而是具有bx.time属性。也许你可以试试......

$(document).on('click','.time',function(){
  myCountdownTest.bx.time=myCountdownTest.bx.time+20;  
});

我不确定这是否是正确的方法，因为我不知道库的api，但这应该解释为什么它没有按照你的预期进行。

更新：如果在init ...

之后没有用于更新时间的API

有点残酷，但您可以尝试使用更新的时间参数重新初始化对象...

$(document).on('click','.time',function(){
  myCountdownTest = new Countdown({
                            time: myCountdownTest.bx.time+20, 
                            width:200, 
                            height:80, 
                            rangeHi:"minute"
                            });
});

使用js修改测验计数器

2 个答案: