zoukankan      html  css  js  c++  java
  • ajax实现下载功能

    ajax实现下载功能

    适用场景:由于点击按钮下载excel响应时间过长,此时间段加入加载样式(灰色层、加载动画);

          浏览器弹出下载框后,上面的加载样式去掉。  

     方     法 :使用jquery.fileDownload.js插件导出excel;

          弹出框样式引用layer.js框架;

    实现过程:


     【前台部分】

    ①头部引入文件:

    <script type="text/javascript" src="js/jquery-2.1.3.min.js"></script>

    <script type="text/javascript" src="layer/layer.js"></script>
    <script type="text/javascript" src="js/jquery.fileDownload.js"></script>

     ②js代码

    $("#btn").click(function() {
    var index = layer.load(1, {
    shade: [0.5, '#000'] //0.5透明度的黑色背景
    });
    $.fileDownload('index.php', {
    httpMethod: 'POST',
    data: $('#form1').serialize(),
    successCallback: function() {
    layer.closeAll('loading');
    },
    failCallback: function(responseHtml, url) {
    layer.msg('加载中..');
    }
    });
    });


     【后台部分(php)】

    关键在于:header('Set-Cookie: fileDownload=true; path=/');

    因为使回调函数successCallback和failCallback起作用,所以在后台代码中返回Cookie(上面一行代码即可实现)。

    (php完整代码如下)

    <?php
    error_reporting(E_ALL);
    date_default_timezone_set('Asia/Shanghai');
    require_once './Classes/PHPExcel.php';
    $data=array(
    0=>array(
    'id'=>1001,
    'username'=>'张飞',
    'password'=>'123456',
    'address'=>'三国时高老庄250巷101室'
    ),
    1=>array(
    'id'=>1002,
    'username'=>'关羽',
    'password'=>'123456',
    'address'=>'三国时花果山'
    ),
    2=>array(
    'id'=>1003,
    'username'=>'曹操',
    'password'=>'123456',
    'address'=>'延安西路2055弄3号'
    ),
    3=>array(
    'id'=>1004,
    'username'=>'刘备',
    'password'=>'654321',
    'address'=>'愚园路188号3309室'
    )
    );
    $objPHPExcel=new PHPExcel();
    $objPHPExcel->getProperties()->setCreator('http://www.phpernote.com')
    ->setLastModifiedBy('http://www.phpernote.com')
    ->setTitle('Office 2007 XLSX Document')
    ->setSubject('Office 2007 XLSX Document')
    ->setDescription('Document for Office 2007 XLSX, generated using PHP classes.')
    ->setKeywords('office 2007 openxml php')
    ->setCategory('Result file');
    $objPHPExcel->setActiveSheetIndex(0)
    ->setCellValue('A1','ID')
    ->setCellValue('B1','用户名')
    ->setCellValue('C1','密码')
    ->setCellValue('D1','地址');

    $i=2;
    foreach($data as $k=>$v){
    $objPHPExcel->setActiveSheetIndex(0)
    ->setCellValue('A'.$i,$v['id'])
    ->setCellValue('B'.$i,$v['username'])
    ->setCellValue('C'.$i,$v['password'])
    ->setCellValue('D'.$i,$v['address']);
    $i++;
    }
    $objPHPExcel->getActiveSheet()->setTitle('三年级2班');
    $objPHPExcel->setActiveSheetIndex(0);
    $filename=urlencode('学生信息统计表').'_'.date('Y-m-dHis');

    //生成xlsx文件
    /*
    header('Content-Type: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
    header('Content-Disposition: attachment;filename="'.$filename.'.xlsx"');
    header('Cache-Control: max-age=0');
    $objWriter=PHPExcel_IOFactory::createWriter($objPHPExcel,'Excel2007');
    */

    //生成xls文件
    header('Content-Type: application/vnd.ms-excel');
    header('Content-Disposition: attachment;filename="'.$filename.'.xls"');
    header('Cache-Control: max-age=0');
    header('Set-Cookie: fileDownload=true; path=/');
    $objWriter = PHPExcel_IOFactory::createWriter($objPHPExcel, 'Excel5');

    $objWriter->save('php://output');
    exit;

  • 相关阅读:
    springboot-web进阶(四)——单元测试
    Java Programming Language Enhancements
    浅谈现代编程语言语法与标准库紧绑定现象
    Objective-C如何自己实现一个基于数组下标的属性访问模式
    Objective-C如何自己实现一个for-each语法形式
    Objective-C中的self与LLVM Clang新引入的instancetype
    在Win7下玩PC游戏发生类似d3d9x_43.dll找不到的情况
    x86架构64位模式下的寄存器列表
    OpenCL如何判定一个work-group的最大Local Memory大小
    关于一个GPGPU优化中Bank Conflict的讨论
  • 原文地址:https://www.cnblogs.com/webzwf/p/6425013.html
Copyright © 2011-2022 走看看