时间戳

首页 > 解决方案 > Outlook 更改 Office 加载项上的 html

outlook - Outlook 更改 Office 加载项上的 html

问题描述

我尝试编写一个将链接插入电子邮件正文的 Outlook 插件。我想给链接一个样式，以便看起来像一个按钮，给用户一个更吸引人的体验。

我遇到的问题是，outlook 改变了元素的样式，而我在该元素上放置的内联样式正在丢失。

我正在插入 HTML，如下所示：

var tablePref = '<table align="left" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse;margin: 0;"><tr><td border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse;margin: 0;padding: 10px 18px;background:\'';

var backgroundColor = 'green'; //The color is user-given, I put green as an example

var tableSuf = '\'"><a href="https://somelink.com" style="text-decoration:none">Some text</a></td></tr></table>'


var item = Office.context.mailbox.item;

item.body.setAsync(tablePref+backgroundColor+tableSuf,
  { 
    coercionType: Office.CoercionType.Html, 
    asyncContext: {} 
  },
  function (asyncResult) {
    if (asyncResult.status ==   Office.AsyncResultStatus.Failed)
    {
      //Show error dialog
    }
    else 
    {
      //Successfully set data in item body.
    }
  });

我成功获取了邮件上的链接，看起来刚刚好，但是当我发送邮件时，这个按钮的 HTML 结构却变成了这样：

<table class="MsoNormalTable" border="0" cellspacing="0" cellpadding="0" align="left" style="border-collapse: collapse">
  <tbody>
    <tr>
      <td style="background: 'green';">
        <p class="MsoNormal" style="mso-element: frame; mso-element-frame-hspace: 2.25pt; mso-element-wrap: around; mso-element-anchor-vertical: paragraph; mso-element-anchor-horizontal: column; mso-height-rule: exactly">
          <a href="https://somelink.com" target="_blank" rel="noreferrer">
          <span style="text-decoration: none">Some Text</span>
          </a>
          <!-- o ignored -->
        </p>
      </td>
    </tr>
  </tbody>
</table>

Outlook 正在更改我的 a 元素，这会导致邮件客户端使用下面的一行呈现该元素，因为该样式已被覆盖。有什么方法可以避免 Outlook 更改我的 HTML 或者这是一个已知错误？这发生在所有平台上（OWA、Outlook for Mac 16.21 和 Outlook for Windows）

谢谢你的帮助

标签： outlookoffice365office-jsoffice-addinsoutlook-web-addins

解决方案

推荐阅读