如何将图像从数据库传递到JavaScript？

我是JavaScript新手，我试图将数据库中的图像传递到JavaScript，但我不能。如何将图像从数据库传递到JavaScript？

问题的代码是：

'<img src="<?php echo base_url().'./images/burger/'.$val->image ?>">';

，这是我的代码

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
</head> 
<body> 
<div id="box"> 
    <img id="image" /> 
</div> 
<?php 
$query = $this->db->get('product'); 
foreach($query->result() as $val): 
?> 

<script> 

    var images = 
    '<img src="<?php echo base_url().'./images/burger/'.$val->image ?>">'; 

function randImg() { 
    var size = images.length 
    var x = Math.floor(size * Math.random()) 
    document.getElementById('image').src = images[x]; 
} 

randImg(); 
</script> 
<?php endforeach; ?> 
</body> 
</html>

来源

2015-11-06 user307709

如果我没有记错的话，你正在使用笨，需要知道什么是错误说... –

codeigniter它可以。但通过图像转换为JavaScript我不能 – user307709

@MarmikBhatt你没有错。 'codeigniter'标签将其送走.. – MaggsWeb

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Javascript random image</title> 
     <?php 
      /* Query the db */ 
      $query = $this->db->get('product'); 
      /* use php to generate the javascript array of images from db query */ 
      echo " 
      <script type='text/javascript'> 
       var images=[]; 
       var baseurl='".base_url()."'; 
       var path='./images/burger/';"; 

      foreach($query->result() as $val){ 
       /* Add image to javascript array */ 
       echo "images.push('{$val->image}');\n"; 
      } 

      echo " 
      </script>"; 
     ?> 
     <script type='text/javascript'> 

      function rnd_index(a,b) { 
       return Math.round(a + (Math.random() * (b - a))); 
      } 
      function randImg() { 
       var x = rnd_index(0, images.length-1); 
       document.getElementById('image').src = baseurl + path + images[ x ]; 
      } 

      function orig__randImg() { 
       var size = images.length;/* This might be too large sometimes for the array */ 
       var x = Math.floor(size * Math.random()); 
       document.getElementById('image').src = path + images[ x ]; 
      } 
      /* Load a random image when the page has loaded */ 
      window.onload=randImg; 
     </script> 
    </head> 
    <body> 
     <div id="box"> 
      <img id="image" /> 
     </div> 
    </body> 
</html>

来源

2015-11-06 08:52:09 RamRaider

它是我的工作感谢兄弟.very谢谢q：D – user307709

我唯一担心的是，从数组MIGHT中选择的随机数有时会太高，导致错误。看看编辑/修改后的版本。 – RamRaider

in var path ='。/ images/burger /';“; – user307709

你需要创建一个javascript和array的push图像路径。

之前<?php foreach(...

<script> 
    var images = []; 
    function randImg(images) { 
     var size = images.length 
     var x = Math.floor(size * Math.random()) 
     document.getElementById('image').src = images[x]; 
    } 
</script>

在循环中..

<script> 
    images.push("<?php echo base_url().'./images/burger/'.$val->image ?>"); 
</script>

循环后...

<script> 
    randImg(images); 
</script>

来源

2015-11-06 08:48:17

谢谢q帮助 – user307709

如何将图像从数据库传递到JavaScript？

回答

相关问题