Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

122
Views
Unable to preview same image using Javascript Php

I am working with php and javascript,Right now i am trying to display "image preview" before upload,I can cancel image and can select another image after display "preview",But whenever i cancel any image(via click on "close" button ) and then select same image then "preview" not displaying ,In other words if i select another image after cancecl then everything is working fine but if i cancel and select same image again then "image preview" not displaying Here is my html code

<span class="previewpostimage"><img id="thumb" src="" /></span>
<span class="close_btn_t">
<button type="button" id="closebtn" style="display:none;"><span aria-hidden="true">×</span>
</button>
</span>
                    
<ul class="media_r_i_att_pp">
   <li class="new_Btn"><a href="#"> <img src="assets/social/images/media_pt_att_xt.svg" alt="img"></a>
</li> 
    <input type="file" id="my_file" name="file" onchange="preview()" style="display: none;"/>
</a></li> 
</ul>

Here is my script code for "select image" and "preview image"

<script>
$('.new_Btn').click(function() {
    $('#my_file').click();
});

$('#closebtn').click(function() {
     $('#thumb').attr('src', '');
     $('#closebtn').hide('');
});

function preview() {
    $('#thumb').show('');
    $('#closebtn').show('');
   thumb.src=URL.createObjectURL(event.target.files[0]);
}
</script>
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Seems like you need to reset the value of file input every time you click on 'x' because your preview() will call only on value change of file input.

$('#closebtn').click(function () {
    $('#thumb').attr('src', '');
    $('#closebtn').hide('');
    $('#my_file').val('');
});
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!