<div class="works-wrap">  <div class="figure-box" id="figure_box"></div>  <div class="add-btn">   <input type="file" id="imgUploadBtn" />   <a href="javascript:void(0);" rel="external nofollow" ><i></i>添加作品</a></div>  </div> </div> 

var addWork = {  add: function(btn, figure_box) {  var figureBox = document.getElementById(figure_box); //獲取顯示圖片的div元素  var input = document.getElementById(btn); //獲取選擇圖片的input元素  //這邊是判斷本瀏覽器是否支持這個API。  if (typeof FileReader === 'undefined') {   alert("瀏覽器版本過低，請先更新您的瀏覽器~");   input.setAttribute('disabled', 'disabled');  } else {   input.addEventListener('change', readFile, false);  //如果支持就監聽改變事件，一旦改變了就運行readFile函數。  }   function readFile() {   var file = this.files[0]; //獲取file對象   //判斷file的類型是不是圖片類型。   if (!/image///w+/.test(file.type)) {   alert("請上傳一張圖片~");   return false;   }    var reader = new FileReader(); //聲明一個FileReader實例   reader.readAsDataURL(file); //調用readAsDataURL方法來讀取選中的圖像文件   //最后在onload事件中，獲取到成功讀取的文件內容，并以插入一個img節點的方式顯示選中的圖片   reader.onload = function(e) {   // 創建一個新增的圖片和文字input   var figure = $('<div class="figure"><div class="figure-hd">我的頭部</div><div class="figure-bd"><img src="' + this.result + '" /><textarea placeholder="請輸入文字"></textarea></div></div>');   figure.appendTo(figureBox);   }  }  } }