拷贝Excel多行多列,粘贴至HTML后自动生成多个文本框
<!DOCTYPE html> <html> <head> <title>copytablehtml.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> <script type="text/javascript" src="../jquery/jquery-1.9.1.min.js"></script> </head> <body> <div id="div1">请选中我,然后粘贴</div> <script> var tableNode; $('#div1').bind('paste', function(e) { event.preventDefault(); //消除默认粘贴 //获取粘贴板数据 var data = null; var clipboardData = window.clipboardData || e.originalEvent.clipboardData; // IE || chrome data = clipboardData.getData('Text'); console.log(data.replace(/\t/g, '\\t').replace(/\n/g, '\\n')); //data转码 //解析数据 var arr = data.split('\n') .filter(function(item) { //兼容Excel行末\n,防止出现多余空行 return (item !== "") }).map(function(item) { return item. split("\t"); }); tableNode=document.createElement("table");//获得对象 var row=arr.length; var cols=arr[0].length; for(var x=0;x<row;x++){ var trNode=tableNode.insertRow(); for(var y=0;y<cols;y++){ var tdNode=trNode.insertCell(); //tdNode.innerHTML="单元格"+(x+1)+"-"+(y+1); tdNode.innerHTML="<input type='text' name='tname_"+(x+1)+"_"+(y+1)+"' value='"+arr[x][y]+"'/>"; } } document.getElementById("div1").appendChild(tableNode);//添加到那个位置 }); </script> </body> </html>