Question

我有以下代码，这部分是我的HTML页面所做的。

<script>
function close() {
    MainJavaScript();
}
function MainJavaScript()
{
    //var strEntity = " ";
    var strEntity = document.getElementById('Entity').value;
    //Images setup by Entity
    if (strEntity == "MGP") 
    {
        document.getElementById('displayPic').src="http://mgp75.png";
    }
    else if (strEntity == "MPP")
    {
        document.getElementById('displayPic').src="http://mpp75.png";
    }
    else if (strEntity == "RSC")
    {
        document.getElementById('displayPic').src="http://rsc75.png";
    }
    else if (strEntity == "MSN")
    {
        document.getElementById('displayPic').src="http://msn75.png";
    }

    var strFirstName = "John";
    var strLastName = "Doe";
    var strSuffix = " ";
    var strTitle = "DDS";
    var strSecondaryTitle = " ";
    var strDisplayName = strFirstName + " " + strLastName;
    if (strTitle.trim() != '')
        strDisplayName += ", " + strTitle;
    if (strSuffix.trim() != '')
        strDisplayName += ", " + strSuffix;
    if (strSecondaryTitle.trim() !='')
        strDisplayName += ", " + strSecondaryTitle;


    document.getElementById('FullName').innerHTML = strDisplayName;
}
</script>

<a href="javascript:close()">Submit</a>


<table>
    <tr>
        <td width="55%">

            <div class="first">
                <div class="contact-info">
                    <h3><img id="displayPic" src="" alt=""></h3>
                </div><!--// .contact-info -->
            </div>
        </td>
        <td width="40%">
            <div>
                <h1><font color="#003893" face="Georgia">Cu Vi</font></h1>
                <h2><span id="FullName"></span></h2>
            </div>
        </td>
    </tr>
</table>

当我点击Submit按钮时，displayPic和FullName会被MainJavascript功能替换为相应的值。我想要做的是从输出创建一个PDF但不幸的是我找到的所有DLL和方法都要求我输出一个HTML文件，然后转换为PDF，但因为它使用的是JavaScript，所以源始终是空白但是显示单击按钮后会更改。

如何实现我想要做的，将输出转换为PDF？

Answer 1

你应该看一下Xep CloudFormatter。这个库，jquery插件，打印任何html页面。所以，根据你的例子，如果我开始使用像你一样的HTML模板，然后使用javascript / jquery我填充html，然后调用xepOnline.Formatter.Format来渲染它，你将得到一个漂亮的PDF。

我简化了你的代码，但这里有一个小提琴供你探索：

http://jsfiddle.net/kstubs/56x6W/

function printMe() {
  tryAtMain();
  var imgLoad = imagesLoaded($('#displayPic')[0]);
  imgLoad.on( 'always', function() {
      xepOnline.Formatter.Format('print_me', {
          pageMargin: ".25in"
      });
  });
}

function tryAtMain() {
// some pic
$('#displayPic').attr('src','http://lorempixel.com/output/abstract-q-c-370-222-1.jpg');
$('#FullName').html('Johnny Carson');
}

如何将自动生成的HTML导出为PDF

1 个答案: