HTML电子邮件:使用<a href>制作可点击的表格

Question

HTML电子邮件:使用<a href>制作可点击的表格

我正在构建一个HTML电子邮件,并希望整个表格可以点击.

我已经提出了一个JavaScript解决方案来做到这一点,这非常有效,但我更喜欢将表包装在标签中而不是使用JavaScript.

<a href="#">
  <table border="0">
   <tr>
    <td style="width: 100px; height: 100px">
    </td>          
   </tr> 
  </table>
</a>

Run Code Online (Sandbox Code Playgroud)

这在Firefox中运行得很好,虽然它不是有效的HTML,因为我在内联one()中包含了一个块级元素().

我目前没有办法在所有电子邮件平台上测试这个,所以想知道是否有任何已知的电子邮件平台不支持这种方法？

任何帮助将不胜感激.

如果有人正在寻找一个JavaScript解决方案来执行相同的功能,那么下面是一个:

            <html>
                <head>
                <title></title>
                <script type="text/javascript">
                function link(url){
                alert("url is "+url);
                }
                </script>
                </head>
                <body>
                <table style="background-color: red" border="0" onclick="link('test url');" onmouseover="this.style.cursor='pointer';">
                  <tr>
                    <td style="width: 100px">This is a </td>
                    <td style="width: 100px; background-color: blue">test </td>
                    <td style="width: 100px">table </td>
                  </tr>
                </table>
                </body>
            </html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Dan*_*ows 14

这适用于Firefox,因为在HTML5中,您可以围绕块元素(即a <table>)包装链接.

但是,在电子邮件中,您仍然坚持使用HTML4,以及它的一个非常有限的子集.这包括使用JavaScript - 这在Gmail,Yahoo,Outlook和所有其他大型邮件客户端中不起作用.

所以你有两个选择:

将表保存为图像,然后将链接标记包裹起来.缺点是图像关闭时您的文本不会显示.
使表格中的所有内容都可以点击 - 即在文本的所有位置重复"a"标记.这里的缺点是任何空的空间(即没有文字或图像的区域)都是不可点击的.

这些链接可能会帮助您:

JavaScript 在大约 99% 的情况下不起作用，并且会损害您的可交付性。我根本不会使用它。 (2认同)

Answer 2

Dre*_*man 4

您将无法在电子邮件中使用 javascript...所有样式都需要内联，也没有 javascript，电子邮件客户端不会呈现它。

归档时间：	13 年，10 月前
查看次数：	28734 次
最近记录：	8 年，2 月前