如何使用 html2pdf 库隐藏不同的 div 或元素儿童？

问题描述

我在 scout 框架中只使用 javascript，从 dinamic html 站点获取 pdf，我的 index.js：

function buttonHtml2Pdf() {
    button = '<input type= "button" value="Stampa html2Pdf" id="html2pdf" class="menu-item menu-button unfocusable menubar-item left-of-button";" />';
    $(button).insertBefore($("div[data-classid='DettaglioArticoliButton_org.eclipse.scout.apps.crm.client.crm.ContoClienteForm_InnerFormField_org.eclipse.scout.apps.crm.client.crm.MainClienteForm']"));
    $("#html2pdf").click("click",function() {
        var $elementoDaConvertire = $("div[data-classid='DettaglioOrdineBox_org.eclipse.scout.apps.crm.client.crm.ContoClienteForm_InnerFormField_org.eclipse.scout.apps.crm.client.crm.MainClienteForm']").html();
        var elemClass = $("div[data-classid='org.eclipse.scout.apps.crm.client.crm.ContoClienteForm$MainBox$DettaglioArticoliBox$DettArticoliField$Table_DettArticoliField_org.eclipse.scout.apps.crm.client.crm.ContoClienteForm_InnerFormField_org.eclipse.scout.apps.crm.client.crm.MainClienteForm']").html();
        var opt = {
            margin: 1,filename: 'Dettaglio_Ordini.pdf',image: {
                type: 'jpeg',quality: 0.98
            },html2canvas: {
                scale: 2,letterRendering: true,imageTimeout: 0,width: 850,height: 1200,scrollX: 0,scrollY: 20
            },jsPDF: {
                unit: 'in',format: 'a4',orientation: 'portrait',putOnlyUsedFonts: true,floatPrecision: 'smart'
            }
        };
        var worker = html2pdf();
        worker = html2pdf().set(opt).from($elementoDaConvertire).toContainer().then(() => {
                const doc = $('.html2pdf__container');
                doc.find('.menubar').remove();
                doc.find('.unfocusable').remove();
                //doc.find($("div[data-classid='DeliveryNameOrderField_org.eclipse.scout.apps.crm.client.crm.ContoClienteForm_InnerFormField_org.eclipse.scout.apps.crm.client.crm.MainClienteForm']").html()).remove();
                doc.find('.field has-inner-alignment halign-left valign-top white-space-Nowrap').hide();
            })
            .toPdf().get('pdf')
            .then(function(pdf) {
                pdf.addPage();
            }).set(opt).from(elemClass).toContainer().toCanvas().then(() => {
                var doc2 = $('.html2pdf__container');
                doc2.find('table-header-item-text').remove();
            }).toPdf().save().catch(function(error) {});

    });
}

如您所见，我必须采用从 scout 框架生成的“data-classid”，我无法修改 id，而且 taht 也不会使用 jquery 监听我的 $(".class") 调用。我该怎么做才能隐藏一些元素？ doc.find().hide()/remove() 只适用于 2 个类：菜单栏和不可聚焦，如果我添加其他类，则不会被采用。

如果这个库不是解决方案，我还能做什么？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）