方法一:
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Title</title>
- </head>
- <body>
- <div class="place">
- <span > 位置:</span>
- <ul class="placeul">
- <li><a href="#">首页</a></li>
- <li><a href="#">系统 - 设备信息</a></li>
- </ul>
- </div>
- <div class="deviceInformation">
- <ul class="detail">
- <li class="item">名称:<span id="name">工业监测审计系统</span></li>
- <li class="item">型号:<span id="type">INA-200</span></li>
- <li class="item">硬件版本:<span id="hardwareVersion">INA-200-V1802005C</span></li>
- <li class="item">软件版本:<span id="softwareVersion">V2.0</span>
- <form method="POST" enctype="multipart/form-data" action=""id="form">
- <input type="submit" value="升级" class="updateGrade">
- <input type="file" name="file" id="groupUuid">
- </form>
- </li>
- <li class="item">序列号:<span id="serialNumber">CY18-NA2B-A018-5081</span></li>
- <li class="item">制造商:<span id="manufacturer"> 科技 (北京) 有限公司</span></li>
- <li class="item">出厂日期:<span id="productionDate">2018 年 2 月 10 日</span></li>
- </ul>
- </div>
- </body>
- </html>
方法二:
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Title</title>
- <link href="../static/CSS/style.css" rel="stylesheet" type="text/css"/>
- <link href="../static/css/style_qc.css" rel="stylesheet" type="text/css"/>
- <script type="text/javascript" src="../static/js/jquery.min.js"></script>
- </head>
- <body>
- <div class="place">
- <span > 位置:</span>
- <ul class="placeul">
- <li><a href="#">首页</a></li>
- <li><a href="#">系统 - 设备信息</a></li>
- </ul>
- </div>
- <div class="deviceInformation">
- <ul class="detail">
- <li class="item">名称:<span id="name">工业监测审计系统</span></li>
- <li class="item">型号:<span id="type">INA-200</span></li>
- <li class="item">硬件版本:<span id="hardwareVersion">INA-200-V1802005C</span></li>
- <li class="item">软件版本:<span id="softwareVersion">V2.0</span>
- <form id="uploadForm" enctype="multipart/form-data">
- <input id="file" type="file" name="file"/>
- <button id="upload" type="button">升级</button>
- </form>
- </li>
- <li class="item">序列号:<span id="serialNumber">CY18-NA2B-A018-5081</span></li>
- <li class="item">制造商:<span id="manufacturer"> 科技 (北京) 有限公司</span></li>
- <li class="item">出厂日期:<span id="productionDate">2018 年 2 月 10 日</span></li>
- </ul>
- </div>
- </body>
- </html>
- <script type="text/javascript">
- $(function () {
- $.ajax({
- type: 'get',
- data: "system_deviceInformation",
- url: "/system/devinfo/getinfo",
- success: function (data) {
- $("#name").html(data.name);
- $("#type").html(data.type);
- $("#hardwareVersion").html(data.hardwareVersion);
- $("#softwareVersion").html(data.softwareVersion);
- $("#serialNumber").html(data.serialNumber);
- $("#manufacturer").html(data.manufacturer);
- $("#productionDate").html(data.productionDate);
- }
- });
- $("#upload").click(function () {
- $.ajax({
- url: './template',
- type: 'POST',
- cache: false,
- data: new FormData($('#uploadForm')[0]),
- processData: false,
- contentType: false
- }).done(function (res) {
- console.log(1111)
- }).fail(function (res) {
- console.log(222)
- });
- })
- });
- </script>
方法三:
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title > 网站后台管理系统 HTML 模板 -- 模板之家 www.cssmoban.com</title>
- <link href="../../static/css/style.css" rel="stylesheet" type="text/css"/>
- <link href="../../static/css/style_qc.css" rel="stylesheet" type="text/css"/>
- <script type="text/javascript" src="../../static/js/jquery.min.js"></script>
- <script type="text/javascript" src="../../static/js/jquery.uploadify.js"></script>
- </head>
- <body>
- <div class="place">
- <span > 位置:</span>
- <ul class="placeul">
- <li><a href="#">首页</a></li>
- <li><a href="#">系统 - 设备信息</a></li>
- </ul>
- </div>
- <div class="deviceInformation">
- <ul class="detail">
- <li class="item">名称:<span id="name">工业监测审计系统</span></li>
- <li class="item">型号:<span id="type">INA-200</span></li>
- <li class="item">硬件版本:<span id="hardwareVersion">INA-200-V1802005C</span></li>
- <li class="item">软件版本:<span id="softwareVersion">V2.0</span>
- <input type="file" name="file_upload" id="file_upload">
- </li>
- <li class="item">序列号:<span id="serialNumber">CY18-NA2B-A018-5081</span></li>
- <li class="item">制造商:<span id="manufacturer"> 长扬科技 (北京) 有限公司</span></li>
- <li class="item">出厂日期:<span id="productionDate">2018 年 2 月 10 日</span></li>
- </ul>
- </div>
- </body>
- </html>
- <script type="text/javascript">
- $(function() {
- $('#file_upload').uploadify({
- '../../static/js/uploadify.swf' : 'uploadify.swf',//swf 为 uploadify.swf 文件的路径
- '/system/devinfo/getinfo' : 'devinfo.py'// uploader 为后台处理程序的路径
- });
- });
- </script>
来源: http://www.qdfuns.com/article/40901/8912ce05077d2d9edfe54813e6e6b100.html