0

我想从我的 html 中获取文本并保留正确的格式，就像它在浏览器上的样子一样。

我要这个

               CompanyName
              CompanyAddress
           Company Phone Number

       1  Item1   7.00   0%   7.00
       2  Item2   5.00   0%   5.00
                  TOTAL:         2
               SUBTOTAL:     12.00
                   CASH:     12.00

我得到这个

                    CompanyName
                   CompanyAddress
                Company Phone Number

                   1  

                   Item1   

                  7.00   
                   0%   

                     7.00

我的 HTML：

<div id="printPreview" class="interprise-popover-container">
<div class="interprise-popover-header popover-header">
    <h1 class="title">Print Preview</h1>
    <a class="popover-btn left-popover-btn btn-Cancel">Cancel</a>
    <a class="popover-btn right-popover-btn btn-Done">Done</a>
</div>
<br class="clearfloat"/>
<div id="printPreviewBody" class="interprise-popover-content">
    <div id="print-area">
    <div id="print-header">
        <h4><%= Company %></h4>
        <h6><%= WarehouseAddress %></h6>
        <h6><%= WarehouseCity %>, <%= WarehouseState %> <%= WarehousePostalCode %></h6>
        <h6><%= PhoneNumber %></h6>
        <h6>www.fairysales.com</h6>
        <h5 style="margin-top: 5px;"><%= TransactionType %>#&nbsp;<%= InvoiceCode %></h5>
    </div>
    <div id="print-barcode" style="margin:0 auto; "></div>
    <span style="font-size: 12px;">Monday</span>
    <div>
        <table id="print-items" cellspacing="0" width="100%">
                        <tbody>
                          <tr>
                            <td align="right"> 1 </td>
                            <td align="left"> Item1<br></td>
                            <td align="right">12.00</td>
                            <td align="right">0%</td>
                            <td align="right"><div><abbr>12.00</abbr></div></td>
                          </tr>
                       </tbody>
        </table>
    </div>
    <div id="print-total">
    </div>
</div>
</div>

顺便说一句，我用

$("#print-header").text(); to extract the text from the div

更新：这里是 jsfiddle

http://jsfiddle.net/8yC5G/1/

我想要实现的实际上与结果相同，但采用文本格式，因此我可以将其作为字符串从 javascript 传递给目标 c。

4

2 回答 2

0

我认为使用$("#print-header").html();应该可以解决您的问题。

请参阅$.text() 文档和$.html() 文档。

于 2012-07-24T10:47:29.263 回答
0

由于您的 html 与您所说的和您从哪里得到的不一致，我会假设您不想要条形码，您不想要“星期一”，您不想要“交易类型”/“发票” -code' 最后没有 'www.fairysales.com'
我还假设您希望 <%= WarehouseCity %>、<%= WarehouseState %> <%= WarehousePostalCode %> 彼此相邻。

但更重要的是：我猜你控制这个 html-source 和它的生成，因为你在你的'print-header'中使用了 vars。
那么我假设你也有生成 2 个表的 var：'print-items' 和 'print-total' 对吗？

好吧，如果您有变量..并且实际上想将它们传递给“目标c”，那么..您可以控制用于将此数据发送到目标c应用程序以执行进一步任务的数据格式。

但是，如果您仍然希望将渲染的 html 文本等效为（单）间隔的纯文本（例如，在 htm 电子邮件中向客户提供纯文本回退）作为目标 c 的输入，那么您需要更多地考虑您的数据，就像在旧学校时代一样：在最坏的情况下，每个字段将有多少字符？这是您随后需要附加/前置的空白字符数量（以模拟表格中的右/左对齐）。这并不难。

现在假设您无权访问构建发送到浏览器的 html 的变量。
然后您将不得不做一些事情来递归解析您的 html-blocks 获取包含数据的“innerTEXT”/“textContent”您需要（它也可以查看表格的单元格的对齐方式），然后才能使用上述技术（数据格式/计算/前置/附加）。

所以..你控制var的吗？

希望这可以帮助！

ps：我推荐了一种等距字体，因为..你还要如何按照你发布“你想要的”的方式来对齐你的数据？
ps2：我其实也想知道..为什么<div><abbr>12.00</abbr></div>？

更新：我摆弄了你的小提琴并构建了一个完全符合你想要的功能。见jsfiddle.net/8yC5G/3/
函数的返回函数还是比较脏的，可以做一些优化。也许我会再弄一些。注意：在 FF 中构建和测试，使用“textContent”而不是“innerTEXT”。

UPDATE2： jsfiddle.net/8yC5G/6/：新例程，清理了一点，更短，更可靠。自动缩放：P

于 2012-07-25T02:28:37.713 回答