設置上傳文件的圖片url

我有一個小問題，我需要將img src指向一個上傳的文件，在一分鐘之內它是一個託管的圖像，以允許我顯示我希望上傳圖像（s ）行動。設置上傳文件的圖片url

繼承我的HTML文件上傳;

<img src="images/upload.png" name="addimg" id="addimg" onClick="addClickedImage('addimg')" /><br /><br />

JS：

  $('#file-input').change(function(e) { 
    var file = e.target.files[0], 
     imageType = /image.*/; 

    if (!file.type.match(imageType)) 
     return; 

    var reader = new FileReader(); 
    reader.onload = fileOnload; 
    reader.readAsDataURL(file); 

}); 



function fileOnload(e) { 
    var $img = $('<img>', { src: e.target.result }); 
    var canvas = $('#gotcha')[0]; 
    var context = canvas.getContext('2d'); 

    $img.load(function() { 
     context.drawImage(this, 0, 0); 
    }); 
} 

var kImage; 

var img=new Image(); 
img.onload=function(){ 
    kImage=new Kinetic.Image({ 
     image:img, 
     x:175, 
     y:175, 
     width:150, 
     height:150, 
     offset:[75,75], 
     draggable:true 
    }); 
    layer.add(kImage); 
    kImage.rotate(30*Math.PI/180); 
    layer.draw(); 
} 
img.src="https://dl.dropboxusercontent.com/u/139992952/stackoverflow/house-icon.png"; 


$("#rotate").click(function(){ 
    kImage.rotate(kImage.getRotation()+20*Math.PI/180); 
    layer.draw(); 
});

任何幫助將不勝感激，

梅麗莎

來源

2013-12-20 Melissa Boyle

我想我在右邊線與此類似的東西，但它doesn' t相當的工作:(img.src = document.getElementById（name）.getAttribute（「src」）; –

試試這個，可以幫

<input type="file" id="fileupload" name="r1" onchange="readURL(this);" accept="image/gif, image/jpeg, image/png" /> 
<br /> 
<img src="" name="addimg" id="addimg" alt="Uploaded Image" /><br /> 

function readURL(input) { 

    if (input.files && input.files[0]) { 
     var reader = new FileReader(); 
     var fileId=input.id; 
     if(ValidateFileExtension(fileId)) 
     {         
       reader.onload = function (e) { 
       // alert(e.target.result); 
        $('#addimg') 
         .attr('src', e.target.result); 
       }; 

     reader.readAsDataURL(input.files[0]); 
    } 
    else 
    { 
     jAlert("Please select Image file from any of the formats (bmp, gif, png, jpg, jpeg , tiff)"); 
     $('#'+fileId+'').trigger('click'); 

    } 
} 
} 
var validFilesTypes = ["bmp", "gif", "png", "jpg", "jpeg" ,"tiff"]; 

function ValidateFileExtension(id) { 
    var path = $("#" + id).val(); 
    var ext = path.substring(path.lastIndexOf(".") + 1, path.length).toLowerCase(); 
    var isValidFile = false; 

    for (var i = 0; i < validFilesTypes.length; i++) { 
     if (ext == validFilesTypes[i]) { 
      isValidFile = true; 
      break; 
     } 
    } 
    return isValidFile; 
}

來源

2014-05-22 07:21:24 Siva

設置上傳文件的圖片url

回答

相關問題