wkhtmltopdf исключить CSS-файлы из PDF, но показать в HTML

Я работал с wkhmtltopdf и обнаружил, что у меня есть проблемы с ним. Я использую html-страницу для предварительного просмотра содержимого в браузере перед преобразованием в PDF.

Но чтобы сделать его более читабельным в моем предварительном просмотре, я добавил некоторые CSS на страницу: (В javascript/jQuery для документа готово)

  $(document).ready(function () {
    if(window.location.href.indexOf("preview") > -1 && window.location.href.indexOf(".pdf") == -1) {
      appendCSStoHtml();
    }
  });

  function appendCSStoHtml() {
    $("body").css({"background-color":" #F0F8FF"});

    $("#previewHtml").css({
      "margin-left":"15%",
      "margin-right":"15%",
      "margin-top":"15px",
      "max-width":"1024px"});

    $("#previewHtml > h2").css({"margin-left":" 15px"});
  }

Так что это все хорошо и здорово, но когда я создаю свой PDF на основе этой HTML-страницы, тогда CSS также отображается в моем PDF, а контур и фон также присутствуют в PDF.

Я не хочу, чтобы это произошло, я только хочу, чтобы мои элементы стиля CSS отображались на странице HTML, а не внутри PDF.

Как мне этого добиться?

Я пытался со следующим:

  $(document).ready(function () {
    if(window.location.href.indexOf("preview") > -1 && window.location.href.indexOf(".pdf") == -1) {
      appendCSStoHtml();
    }
  });

Но это не имело значения.

Есть идеи?

1 ответ

Решение

Это снова я.

Не уверен, что есть что-то похожее на то, что я ищу. Таким образом я сделал свой собственный.

Я добавил параметр страницы и проверил это в коде, чтобы увидеть, если это true или же false:

<script type="text/javascript">

  $(document).ready(function () {
    var url_string = window.location.href;
    var url = new URL(url_string);
    var renderCss = url.searchParams.get("renderCss");

    if(renderCss == 'true') {
      appendCSStoHtml();
    }
  });

  function appendCSStoHtml() {
    $("body").css({"background-color":" #F0F8FF"});

    $("#previewHtml").css({
      "margin-left":"15%",
      "margin-right":"15%",
      "margin-top":"15px",
      "max-width":"1024px"});

    $("#previewHtml > h2").css({"margin-left":" 15px"});
  }

</script>
Другие вопросы по тегам