Live image preview for file browser

file_browser_live_image_preview.html

<h1>Sample#preview_image_file_browser</h1>

<input id="one_image" name="one_image" type="file">

<div id="preview_container"></div>

<script type="text/javascript">
var setPreviewImage = function(file){
  var reader = new FileReader(),
      newImage = new Image();
  reader.onload = function(evt){
    newImage.src = evt.target.result; // set preview source
    newImage.width = 500 // set preview width
  };
  reader.readAsDataURL(file[0]);
  $("#preview_container").html(newImage);
}

$(document).ready(function(){
  $("#one_image").bind("change", function(evt){
    evt.preventDefault();
    var files = evt.target.files;
    setPreviewImage(files)
  });
})
</script>