html5数组画布图片麻烦

时间:2013-08-13 11:30:27

标签: html html5 html5-canvas

我只想制作一个简单的幻灯片演示文稿,但不起作用。 甚至我说:

var mycars=new Array();
mycars[0] = "Saab";
mycars[1] = "Volvo";
mycars[2] = "BMW";
alert(mycars[0]);

但它没有警觉。 有人能帮我吗 用代码?什么问题

我认为问题是数组obj。 请帮忙!!快!!谢谢大家!!!

<html>

<head>
<title></title>

<script language="javascript">
//start from img[0]
var imgNum = 0;
var currentImg = 0;
var img = new Array();
var canvas = document.getElementById('canv');
canvas.width = 500;//document.body.clientWidth
canvas.height = 500;//document.body.clientHeight

var context = canvas.getContext('2d');

function loadImg(){
        alert("loadimg work");
        img[imgNum] = new Image();
        img[imgNum].addEventListener('load', eventLoaded, false);
        img[imgNum].src = String(imgNum)+".jpg";    
}

loadImg();

    function eventLoaded(){
        alert("loaded");
        if(imgNum==0){      
            context.drawImage(img[0], 0, 0);
        }
        imgNum = imgNum+1;
        loadImg();
    }

function clicked(){
    alert('clicked');
    context.clearRect(0, 0, canvas.width, canvas.height);
    var displayImgNum = currentImg+1;
    context.drawImage(img[displayImgNum], 0, 0);
}
</script>
</head>


<body>
<canvas id="canv" onclick="clicked()">Your browser doesn't support HTML5.</canvas>
</body>

</html>

1 个答案:

答案 0 :(得分:1)

请删除

function loadImg(){
        alert("loadimg work");
        img[imgNum] = new Image();
        img[imgNum].addEventListener('load', eventLoaded, false);
        img[imgNum].src = String(imgNum)+".jpg";    
}

loadImg();