Javascript加载一个随机图像

我想创建一个javascript函数，当函数da_image被调用时将加载一个随机图像。我想要将图像加载到我设置的画布上。我的代码中是否有明显的错误？目前没有任何显示。Javascript加载一个随机图像

var images = [ 
        "http://circlesfordialogue.com/wp-content/uploads/2014/12/LAURA-LET%C2%B4S-CIRCLE-UP-2014-12-08.jpg", 
        "http://mathworld.wolfram.com/images/eps-gif/ConcentricCircles_1000.gif", 
        "http://www.charlespetzold.com/blog/2012/12/BezierCircleFigure3.png" 

      ]; 
      function da_image(){ 
       var file = images[0]; 
       var reader = new FileReader(); 
       reader.onload = function(){ 
         var img = new Image(); 
         img.src = reader.result; 
         img.onerror = function(){ 
          reset_canvas(); 
          o.font = '30px sans-serif' 
          o.fillText('Error: Invalid Image ' + file.name, 50, 100); 
         } 
         img.onload = function(){ 
          document.getElementById("text").innerHTML = 'Recognizing Text... This may take a while...' 
          reset_canvas(); 
          var rat = Math.min(c.width/img.width, c.height/img.height); 
          o.drawImage(img, 0, 0, img.width * rat, img.height * rat) 
          var tmp = document.createElement('canvas') 
          tmp.width = img.width; 
          tmp.height = img.height; 
          var ctx = tmp.getContext('2d') 
          ctx.drawImage(img, 0, 0) 
          var image_data = ctx.getImageData(0, 0, tmp.width, tmp.height); 
          runOCR(image_data, true) 
         } 

        }

来源

2015-06-29 Sarah Markers

那么什么是FileReader，你永远不会读取文件，因此'onload'回调从不会触发。 – adeneo

哦，等等，你实际上是在onload处理程序中读取一个跨域url作为文件。这不起作用，首先有相同的原产地政策，其次，你根本不需要读取图像，并且在onload处理程序内部阅读将不起作用，只需在画布上绘制它，但是你赢了无法修改图片，原因是同样的原产地政策。 – adeneo

然后是未定义的变量'c'，它这个代码只是复制/粘贴？ – adeneo

加载图像时会触发onload处理程序。当你设置一个onload处理程序时，图像已经被加载，它不会被触发。

因此，在设置.onload函数后总是设置.src属性。

来源

2015-06-29 15:46:41 Philipp

Javascript加载一个随机图像

回答

相关问题