excel 데이터 html 표로 복사

4488 단어
시나리오 1
여러 줄 텍스트 상자가 복사된 excel 값을 받은 후 텍스트 상자의 chage 이벤트에서 excel 내용을 2차원 그룹으로 분할한 다음 html 표의 input나textarea에 채웁니다.
데이터 형식: 셀 복사 후 데이터 형식은 "장치\t 결함 유형\r 수압 밸브\t 모재 균열"입니다.
주석: 셀 사이는 "\t"로, 행 사이는 "\r"로 구분됩니다.데이터는 다중 텍스트 상자에 붙여넣어야 합니다. 컨트롤의 줄 바꿈 문자인 "\r
"이 삭제됩니다.표에서 <textarea>를 사용하여 데이터를 수신하려면
  $(function () {
            $("textarea").on("change", function () {
                var str = $(this).val();
                var rowStrArray = str.split("
"); var rows = []; for (var i = 0; i < rowStrArray.length; i++) { var row = []; var tdStrArray = rowStrArray[i].split('\t'); for (var j = 0; j < tdStrArray.length; j++) { row.push(tdStrArray[j]); } rows.push(row); } var startTr = $(this).parents("tr:first"); var startTd = $(this).parents("td:first"); var trIndex = -1; var tdIndex = -1; $("tr").each(function (i, tr) { if (tr == startTr[0]) { trIndex = i; } $(tr).find("td").each(function (j, td) { if (td == startTd[0]) { tdIndex = j; } if (trIndex != -1 && tdIndex != -1 && i >= trIndex && j >= tdIndex) { var rowsIndex = i - trIndex; if (rowsIndex < rows.length) { var row = rows[rowsIndex]; var rowIndex = j - tdIndex; if (rowIndex < row.length) { var val = rows[rowsIndex][rowIndex]; $(td).find("textarea").val(val); } } } }); }) }); });

  
방안 2: 최적화 방안
붙여넣기 이벤트가 발생할 때 클립보드의 내용을 가져와 복사된 excel 내용을 2차원 그룹으로 분할한 다음 html 표의 input나textarea에 채웁니다.
var CopyExcel = function (tableId) {
    $("#" + tableId).find("input,textarea").on("paste", function (e) {
        var pastedText = undefined;
        if (window.clipboardData && window.clipboardData.getData) {
            // IE
            pastedText = window.clipboardData.getData('Text');
        } else {
            //e.clipboardData.getData('text/plain');
            pastedText = e.originalEvent.clipboardData.getData('Text');
        }
        // 
        e.preventDefault();
        var str = pastedText;
        var rowStrArray = str.split("\r
"); var rows = []; for (var i = 0; i < rowStrArray.length; i++) { var row = []; var tdStrArray = rowStrArray[i].split('\t'); for (var j = 0; j < tdStrArray.length; j++) { row.push(tdStrArray[j]); } rows.push(row); } var startTr = $(this).parents("tr:first"); var startTd = $(this).parents("td:first"); var trIndex = -1; var tdIndex = -1; $("tr").each(function (i, tr) { if (tr == startTr[0]) { trIndex = i; } $(tr).find("td").each(function (j, td) { if (td == startTd[0]) { tdIndex = j; } if (trIndex != -1 && tdIndex != -1 && i >= trIndex && j >= tdIndex) { var rowsIndex = i - trIndex; if (rowsIndex < rows.length) { var row = rows[rowsIndex]; var rowIndex = j - tdIndex; if (rowIndex < row.length) { var val = rows[rowsIndex][rowIndex]; $(td).find("input,textarea").val(val); } } } }); }) }); }

  
다음으로 전송:https://www.cnblogs.com/guohu/p/9609437.html

좋은 웹페이지 즐겨찾기