DEMO

Question

我已经编写了一个代码，在单击开始按钮的情况下，我的单词应显示几秒钟。我该怎么做？

function start()
    {

      block.x = 0;
      for (var i = 0; i < boxes.length; i++) 
      {
          resetbox(boxes[i]);


      }
    if (!continueAnimating) 
    {
        continueAnimating = true;
        animate();
    }
    }

我想显示这个让我们说5秒：var text = randomLetter（nu）;

See Demo

Answer 1

我可以给你一个简单的演示，用于在按钮点击：

1秒内在画布上书写和清除文本

DEMO

代码：

var c=document.getElementById("canvas");
var ctx=c.getContext("2d");

function clear(){
     ctx.clearRect(0,0,c.width,c.height);
}

function write()
{
    var c=document.getElementById("canvas");
    var ctx=c.getContext("2d");

    ctx.font="20px Georgia";
    ctx.fillText("Hello World!",10,50);

    ctx.font="30px Verdana";
    // Create gradient
    var gradient=ctx.createLinearGradient(0,0,c.width,0);
    gradient.addColorStop("0","magenta");
    gradient.addColorStop("0.5","blue");
    gradient.addColorStop("1.0","red");
    // Fill with gradient
    ctx.fillStyle=gradient;
    ctx.fillText("Big smile!",10,90);
}

function start()
    {
        write();
        setTimeout(function(){
            clear();
        },1000);
    }

Answer 2

尝试使用以下代码 - 您必须使用setTimeout()

<强> Click Here to See Working Demo

<强> HTML

<div id="someDiv">Your Text Here</div>
<input id="SomeButton" type="button" value="Start">

<强> Jquery的

$(document).ready(function(){
       $("#someDiv").hide();
    $("#SomeButton").click(function(){            
        start();
    });        
});

function start()
{
    $("#someDiv").show();
    setTimeout(function () {
                    $("#someDiv").fadeOut(1000, function () { $(this).hide(); });
                }, 2000);
}

在画布上显示一个字符串，只有几秒钟

2 个答案:

DEMO