时间戳

首页 > 解决方案 > 是否可以通过 ajax 传递具有外部 css 样式的 html？

php - 是否可以通过 ajax 传递具有外部 css 样式的 html？

问题描述

经过长时间的寻找解决方案，我不得不写这篇文章。我希望你能解释我做错了什么。

我有文件 index.php、preview.php、saveToPdf.php 和 doc.html。

索引.php

<head>
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
</head>

//some other code included jquery link

预览.php

// this file contain form, buttons and some function for loading, filling and sending datas.

<?php
   include 'index.php';
?>

// here is some html form

<button id="previewBtn">preview</button>
<button id="saveBtn">save</button>

<div id="content"></div>


<script type="text/javascript">
   fillDocs(){
       // filling the document
   }

   $('#previewBtn').click(function(){
      $('#content').load('./docs/doc.html', function(){
         fillDocs();
      });
   });

   $('#saveBtn').click(function(){
         request = $.ajax({

            url: "./saveToPdf.php",
            type: "POST",
            data: {'data' : $("#content").html(),
                   //other datas
            },
            contentType: 'application/x-www-form-urlencoded; charset=UTF-8'
        });
        
        request.done(function(response, textStatus, jqXHR){
            console.log(response);
            
        });
        request.fail(function (jqXHR, textStatus, errorThrown){

            console.log(textStatus+' '+errorThrown);
        });
   });
   
</script>

保存到PDF.php

// in this file I receive the data and store html content to pdf by MPDF lib.
// the problem is that this html content isn't formatted. It is plain html without css styles.

文档.html

// it is an html document with bootstrap classes

那么我应该怎么做才能获得格式正确的保存文件呢？当我使用内联 css 样式时它正在工作，但我想为此使用引导程序。

标签： phphtmljquerycssajax

解决方案

如他们的文档中所述，您可以设置样式表数据：

$stylesheet = file_get_contents('style.css');

$mpdf->WriteHTML($stylesheet,\Mpdf\HTMLParserMode::HEADER_CSS);
$mpdf->WriteHTML($html,\Mpdf\HTMLParserMode::HTML_BODY);

更改style.css为 CSS 文件的路径。

推荐阅读