$("#imgurl_file").change(function (event) {
console.info(event.target.files[0]);//圖片文件
var dom =$("#imgurl_file")[0];
console.info(dom.value);//這個是文件的路徑 C:\fakepath\icon (5).png
console.log(event.target.value);//這個也是文件的路徑和上面的dom.value是一樣的
var reader = new FileReader();
reader.onload = (function (file) {
return function (event) {
console.info(this.result); //這個就是base64的數據了
$("#imgurl_value").val(this.result);
var sss=$("#showImage");
$("#showImage")[0].src = this.result;
};
})(event.target.files[0]);
reader.readAsDataURL(event.target.files[0]);
});
<div class="form-group col-md-12">
<label class="col-md-2 control-label" for="imgurl">獎品圖片</label>
<div class="col-md-8">
<input type="text" class="form-control col-md-4" id="imgurl_value" readonly>
<input type="text" class="hidden" name="imgurl" id="imgurl">
<input type="file" class="hidden" id="imgurl_file" accept=".gif,.jpg,.jpeg,.png">
<img src="" id="showImage" alt="">
</div>
<button class="btn-primary btn col-md-2" id="imgurl_up_btn">上傳</button>
</div>