关于画布createPattern无法生效的问题(没有使用window.onload导致的问题)

错误代码(画布并没有填充图案)

<script type="text/javascript">
    var c=document.getElementById("drawing");
    var ctx=c.getContext("2d");
    ctx.clearRect(0,0,c.width,c.height); 
    var img=document.getElementById("img")
    var pat=ctx.createPattern(img,'no-repeat');
    ctx.rect(0,0,150,100);
    ctx.fillStyle=pat;
    ctx.fill();
</script>

正确的做法应该使用window.onload事件

<script type="text/javascript">
window.onload = function(){
    var c=document.getElementById("drawing");
    var ctx=c.getContext("2d");
    ctx.clearRect(0,0,c.width,c.height); 
    var img=document.getElementById("img")
    var pat=ctx.createPattern(img,'no-repeat');
    ctx.rect(0,0,150,100);
    ctx.fillStyle=pat;
    ctx.fill();
}
</script>

 


版权声明:本文为qq_23159841原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。