Страница застревает при экспорте HTML-страницы в формате PDF с использованием javascript

#javascript #ajax #jspdf

#javascript #ajax #jspdf

Вопрос:

Привет, у меня есть код, который преобразует HTML-страницу в PDF с помощью CSS с использованием javascript, проблема в том, что когда я нажимаю кнопку, страница застревает и перестает отвечать.

Ниже приведен скрипт, который генерирует ТАБЛИЦУ

 $(document).ready(function(){
 $('#load_data').click(function(){
  $.ajax({
   url:"OutputNew.csv",
   dataType:"text",
   success:function(data){
    var employee_data = data.split(/r?n|r/);
    var table_data = '<div class="dropdown"><button class="dropbtn">Download</button><div class="dropdown-content"><a href="javascript:CreatePDF()">Download PDF</a></div></div><input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names.."><div id="VMTable"><div id="content"><table id="myTable" class="table table-striped"">';
    
    for(var count = 0; count<employee_data.length; count  ) {
     var cell_data = employee_data[count].split(',');
     table_data  = '<tr>';
     for(var cell_count=0; cell_count<cell_data.length; cell_count  ){
      if(count === 0){
       table_data  = '<th id="headers">' cell_data[cell_count] '</th>';
      }else{
          if(cell_data[cell_count] .includes("Not Matching")){
                var ret = cell_data[cell_count].replace('Not Matching','');
                if (ret == ""){
                    table_data  = '<td>' ret '</td>'
                }else{
                  table_data  = '<td data-color="green"><span style="color:red">' ret '</span></td>';
                }
          }else if(cell_data[cell_count] .includes("Matching")){
                var ret = cell_data[cell_count].replace('Matching','');
                if (ret == ""){
                  table_data  = '<td>' ret '</td>'
                }else{
                  table_data  = '<td data-color="green"><span class="badge-complete">' ret '</span></td>';
                }
          }else{
              table_data  = '<td>' cell_data[cell_count] '</td>';
          }
      }
     }
     table_data  = '</tr>';
    }
    table_data  = '</table></div>';
    
    $('#employee_table').html(table_data);
   }
  });   
 }); 
});
  

И здесь будет отображаться таблица:

 <div class="container">
   <div class="table-responsive">
   <!-- <img src="banner.png" id="banner"> -->
    <h1 id ="Heading">Validator</h1>
    <br />
    <div id ="loadbutton">
     <button type="button" name="load_data" id="load_data" class="btn btn-info">Load Data</button>
    </div>
    <br />
    <div id="employee_table">
    </div>
    </div>
   </div>
  </div>
  

Код для экспорта HTML-страницы в PDF

 function CreatePDF(){
    let doc = new jsPDF('p','pt','a4');

  doc.addHTML(document.body,function() {
      doc.save('html.pdf');
  });
}
  

поэтому, когда я нажимаю кнопку загрузки, она застревает и не показывает ошибки.