我想在打印时隐藏数据 table excel 按钮

Question

我有 excel 数据 table 按钮我想在打印页面中隐藏。

  <style type="text/css" media="screen"> 
       @media print {
             .buttons-excel {
                display: none;
            }
          }
      </style>

<section class="content">
        <div class="row">
         <div class="table-responsive">
           <table id="loading_sheet_table" class="table table-bordered  table-sm" style=" overflow: auto;">
          </table>
       </div>
     </div>
    </section>


<script>
   $(document).ready(function() {
  $('#loading_sheet_table').DataTable( {
    "paging": false,
      dom: 'Bfrtip',
      buttons: [
          'excel'
      ]
  } );
} );  

   function printContent(e1) {
   event.preventDefault();
        var allVals = [];
      $('input[name=selectedrecord]:not(:checked').each(function() {
         allVals.push($(this).val());
         });
           allVals.forEach(function(i){
          $('tr').each(function(){
          $(this).find('td, th').eq(i-1).css({
                     display:'none'
         });
      });
    });

    $('#print').css('visibility', 'hidden'); //hiding print button on print page
    $('input[name=selectedrecord]').css('visibility', 'hidden'); //hiding Check box on print page
    var restorepage     = document.innterHTML;
    var printContent    = document.getElementById(e1).innterHTML;
    document.innterHTML = printContent;
    window.print();
    document.location.href = "<?php echo base_url(); ?>"; 
    location.href="<?php echo base_url(); ?>booking/report/loading_sheet/LoadingSheetController/loadingSheetPage", 'refresh';
     }
</script>

我使用@media Print 作为隐藏按钮，但它不起作用。

Answer 1

删除或修改媒体属性

<style type="text/css" media="print">

Answer 2

请试试这个。我想你只需要使用数据表打印选项

<section class="content">
    <div class="row">
     <div class="table-responsive">
       <table id="loading_sheet_table" class="table table-bordered  table-sm" style=" overflow: auto;">
      </table>
   </div>
 </div>
</section>


<script>
   $(document).ready(function() {
  $('#loading_sheet_table').DataTable( {
    "paging": false,
      dom: 'Bfrtip',
      buttons: [
          'excel',
          'print'
      ]
  } );
} );

希望它能解决您的问题。

我想在打印时隐藏数据 table excel 按钮

I want to hide data table excel button on print

javascript

php

jquery

codeigniter

media-queries