zoukankan      html  css  js  c++  java
  • excel数据复制到html表格<textarea>中

    方案一

    多行文本框接收到复制的excel值后,在文本框的chage事件中,将excel内容分割到二维数组中,然后填充到html的表格的input或textarea中。

    数据格式: 单元格复制后的数据格式为"设备 缺陷类型 水压堵阀 母材裂纹"。

    注释:单元格之间通过" "分隔,行间通过" "分隔。数据必须粘贴到<textarea>多文本框中,如果是<input>控件换行符" "会被删除掉。表格中要使用<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('	');
                        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);
                                    }
                                }
                            }
                        });
                    })
                });
            });
    

      

    方案二:优化方案

    粘贴事件发生的时候,获取剪切板的内容,将复制的excel内容分割到二维数组中,然后填充到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("
    ");
            var rows = [];
            for (var i = 0; i < rowStrArray.length; i++) {
                var row = [];
                var tdStrArray = rowStrArray[i].split('	');
                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);
                            }
                        }
                    }
                });
            })
        });
    }
    

      

  • 相关阅读:
    51 Nod 1086 多重背包问题(单调队列优化)
    51 Nod 1086 多重背包问题(二进制优化)
    51 Nod 1085 01背包问题
    poj 2559 Largest Rectangle(单调栈)
    51 Nod 1089 最长回文子串(Manacher算法)
    51 Nod N的阶乘的长度 (斯特林近似)
    51 Nod 1134 最长递增子序列(经典问题回顾)
    51 Nod 1020 逆序排列
    PCA-主成分分析(Principal components analysis)
    Python中cPickle
  • 原文地址:https://www.cnblogs.com/guohu/p/9609437.html
Copyright © 2011-2022 走看看