廢話
項目需求:根據日期讀取某個excel的某塊區域;,生成數組,點擊可復制該數組,另作他用;
根據第幾周讀取不同的sheet(Excel左下角) 周一讀取周一的片名,周二讀取周二的片名,依次。。
Excel 內容區域如下圖:
最終效果實例:
醜瞭點:
看整體代碼:
必要的備註均有
<html> <head> <meta charset="UTF-8"> <title>ReadExcel</title> </head> <link href="./bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen"> <script src="https://code.jquery.com/jquery.js"></script> <script src="./bootstrap/js/bootstrap.min.js"></script> <body> <p class="container"> <select id="selectWeek" name="selectWeek" onchange="getWeekDay()"> <option value="0">第一周</option> <option value="1">第二周</option> <option value="2">第三周</option> <option value="3">第四周</option> <option value="4">第五周</option> </select> <br> <select id="selectDay" name="selectDay" onchange="getWeekDay()"> <option value="A">周一</option> <option value="C">周二</option> <option value="E">周三</option> <option value="G">周四</option> <option value="I">周五</option> <option value="K">周六</option> <option value="M">周日</option> </select> <br> <input type="file" onchange="importf(this)" id="file"/> <br> <textarea cols="20" rows="10" id="textArea"></textarea> <br> <input type="button" onClick="copy()" value="點擊復制代碼"/> </p> <script type="text/javascript" src="./shim.min.js"></script> <script type="text/javascript" src="./xlsx.full.min.js"></script> <script> var wb;//讀取完成的數據 var rABS = false; //是否將文件讀取為二進制字符串 var values = [];//最終要的數組數據 var week = 0;//初始默認定義選取第一周的數據 var day = 'A';//初始默認定義選取第一天的數據,第一天就是A列。看表; var weekDay = [];//初始第一周第一天的為空的 for (var m = 3; m < 100; m++) {//從每一列的第三行開始;看表 weekDay.push(`A${m}`)//初始進入的時候第一周第一天有100條數據,查詢A列,從地三行到地100行的數據;放入數組 } function getWeekDay() {//該方法為獲取哪一周哪一天的列表,某天的數據為 一列默認為從第三行到地100行; var selectWeek = document.getElementById('selectWeek');//基本操作啦 var selectDay = document.getElementById('selectDay');//基操啦! week = selectWeek.value;//獲取人工選擇的是哪一周 day = selectDay.value;//獲取人工選擇的是哪一天 weekDay = [];//如果重復操作該頁面,為瞭防止數據增加。所以要初始化該數組; for (var j = 3; j < 100; j++) { weekDay.push(`${day}${j}`)//最終獲取該列表對應的格數及位置;以備後用; } } function importf(obj) {//導入文件 if (!obj.files || obj.files.length <= 0) {//如果onchange事件發生但是未傳入文件,那麼啥都不幹。 return; } var f = obj.files[0];//f為讀取到的文件 var reader = new FileReader(); reader.onload = function (e) { var data = e.target.result; if (rABS) { wb = XLSX.read(btoa(fixdata(data)), {//手動轉化 type: 'base64' }); } else { wb = XLSX.read(data, { type: 'binary' }); } //wb.SheetNames[0]是獲取Sheets中第一個Sheet的名字 //wb.Sheets[Sheet名]獲取第一個Sheet的數據 // var jsonText = JSON.stringify(XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]])); values = []; for (var i = 0; i < weekDay.length; i++) {//遍歷查找weekDay數組中的數據,組成新數據數組得到最終值values if (wb.Sheets[wb.SheetNames[week]][weekDay[i]]) { var cellValue = wb.Sheets[wb.SheetNames[week]][weekDay[i]].v;// values.push(`"${cellValue}"`) } else { continue } } // console.log(values); var textArea = document.getElementById('textArea'); textArea.value = `[${values}]` obj.value = '' }; if (rABS) { reader.readAsArrayBuffer(f); } else { reader.readAsBinaryString(f); } } function fixdata(data) { //文件流轉BinaryString var o = "", l = 0, w = 10240; for (; l < data.byteLength / w; ++l) o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w, l * w + w))); o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w))); return o; } function copy() {//這個方法完成復制數據功能 var textArea = document.getElementById('textArea'); textArea.select(); // 選擇對象 document.execCommand("Copy"); // 執行瀏覽器復制命令 alert("復制成功"); } </script> </body> </html>