javascript - js error : "'createObjectURL' on 'URL': Overload resolution failed.&qu

I try to display an image on a php page in js, knowing that my image via an input file.here is my code

I try to display an image on a php page in js, knowing that my image via an input file. here is my code:

<script>
  function image(){
    var x = document.getElementById("image_uploads");
    var test = URL.createObjectURL(x);
    //document.getElementById("img").src = URL.createObjectURL(x);
    }
</script>

<body>
  <div class="frItem31">
    <form name="saisie" action="" method="post">
      Image 1 :<input type="file" id="image_uploads" class="image_uploads" name="image_uploads" accept="image/*"/> 
      <br>
       <img id="img" class="img">
       <br>
       <input type="button" id="calcVitesse" class="calcVitesse" value="calculer la vitesse" onclick="image()">
    </form>
  </div>
</body>

here is the error I get:

Uncaught TypeError: Failed to execute 'createObjectURL' on 'URL': Overload resolution failed.
    at image (image.php:20:32)
    at HTMLInputElement.onclick (image.php:80:125)
image @ image.php:20
onclick @ image.php:80

Could you help me please !?!

G.B.

I try to display an image on a php page in js, knowing that my image via an input file. here is my code:

<script>
  function image(){
    var x = document.getElementById("image_uploads");
    var test = URL.createObjectURL(x);
    //document.getElementById("img").src = URL.createObjectURL(x);
    }
</script>

<body>
  <div class="frItem31">
    <form name="saisie" action="" method="post">
      Image 1 :<input type="file" id="image_uploads" class="image_uploads" name="image_uploads" accept="image/*"/> 
      <br>
       <img id="img" class="img">
       <br>
       <input type="button" id="calcVitesse" class="calcVitesse" value="calculer la vitesse" onclick="image()">
    </form>
  </div>
</body>

here is the error I get:

Uncaught TypeError: Failed to execute 'createObjectURL' on 'URL': Overload resolution failed.
    at image (image.php:20:32)
    at HTMLInputElement.onclick (image.php:80:125)
image @ image.php:20
onclick @ image.php:80

Could you help me please !?!

G.B.

Share Improve this question asked Mar 26, 2022 at 18:57 L'ArchitechtL'Architecht 131 gold badge1 silver badge3 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 2

you're passing an HTML element instead of a file. To get the file, use .files property, which behaves like an Array, so you can iterate it. see: https://developer.mozilla/en-US/docs/Web/HTML/Element/input/file#getting_information_on_selected_files

try this:

  function image() {
    var x = document.getElementById("image_uploads");
    if (x.files.length) {
        var test = URL.createObjectURL(x.files[0]);
    }

  }

发布者:admin,转转请注明出处:http://www.yc00.com/questions/1745303203a4621561.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信