实战：第十七章：xlsx文件导入数据入库

2021-10-02 12:34:00 阅读：209 来源： 互联网

标签：第十七章 xlsx resource layui js 导入入库 file css

直接上代码，先是页面，这里用jsp页面，导入的页面，后面的js发送请求通过后台controller跳转到这个页面

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
    <%
        String path = request.getContextPath();
    %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html lang="en" class="html_bg">
     
    <head>
        <title>客户管理导入</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <link rel="stylesheet" href="<%=path%>/resource/css/layui-list.css" media="all">
        <link rel="stylesheet" href="<%=path%>/external/layui/css/layui.css"  media="all">
        <link rel="stylesheet" href="<%=path%>/resource/css/layui-dreamweb.css">
        <link rel="stylesheet" href="<%=path%>/resource/css/layui-list-${portal_skin}.css" media="all">
        <link rel="stylesheet" href="<%=path%>/external/menu-font/iconfont.css">
        <link rel="stylesheet" href="<%=path%>/resource/css/layui-card.css"  media="all">
        <link rel="stylesheet" href="<%=path%>/resource/css/layui-card-blue.css" media="all">
     
        <script type="text/javascript" src="<%=path%>/external/jquery-1.12.4.min.js" charset="utf-8"></script>
        <script type="text/javascript" src="<%=path%>/external/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="<%=path%>/external/layui/layui.all.js?v=v1.016.000.20200529_snapshot"></script>
        <script type="text/javascript" src="<%=path%>/resource/js/file-code-choose.js"></script>
        <script type="text/javascript" src="<%=path%>/resource/js/public.js?v=${version}" charset="utf-8"></script>
        <script type="text/javascript" src="<%=path%>/resource/js/xform.js?v=v1.016.000.20200529_snapshot"></script>
    </head>
     
    <body style="height: 80%">
    <div class="new_window" style="width: 80%; margin: 20px auto;">
        <form enctype="multipart/form-data" id="batchUpload">
            <input type="file" name="file" style="border: 1px solid #969696" id="file">
        </form>
        <br>
        <div style="font-size:14px;height: 250px;overflow: auto;border:1px solid #999999;padding:3px 5px; width: 80%">

导入结果：

<br>
            <div style="font-size:14px;" id="result">还没有导入文件！</div>
        </div>
        <br>
        <button class="datagrid-op layui-btn layui-btn-primary ds-btn2 " type="button" onclick="uploadBtn()" title="导入" id="daochu">导入</button>
        <button class="datagrid-op layui-btn layui-btn-primary ds-btn2 " type="button" onclick="colseAll()" title="导入" id="guanbi">关闭</button>
    </div>
    </body>
    <script type="text/javascript">

 //导入
        function uploadBtn() {
    debugger;
            var file = $("#file").val();
            if(file == ''){
                alert("请选择excel,再上传");
            }else if(file.lastIndexOf(".xls")<0){
                alert("只能上传Excel文件");
            }else {
                $("#result").html("正在导入请稍候...")    ;
                //获取form 表单内容
                var form = document.getElementById("batchUpload");
                //获取form表单中第一个 input type是file的的对象
                var filename=$('input[type=file]')[0].files[0];
                var fm = new FormData(form);
                fm.append('file', filename);

标签：第十七章,xlsx,resource,layui,js,导入,入库,file,css
来源： https://blog.csdn.net/weixin_44519496/article/details/120583526

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

实战：第十七章：xlsx文件导入数据入库