如何创建一个打开Outlook应用程序的html按钮?

时间:2016-10-11 05:05:18

标签: php html css

如何在打开Outlook应用程序的网页中创建一个按钮,其中包含该网页的screeshot附带的撰写邮件(新邮件)选项?

2 个答案:

答案 0 :(得分:4)

您只需使用一行html代码即可实现此目的。

<a href="mailto:someone@something.com?subject=your title&body=TThe message">
    <button id="btnOutlook">Go to Outlook</button>
</a>

这也可以包括其他字段,例如

<a href="mailto:address..?subject=subject...&body=anything...&cc=ccemailaddress@something.com&bcc=bcc@something.com">
    <button id="btnOutlook">...</button>
</a>

这是一种方便的方法,可以添加链接让用户与您联系,而无需任何服务器端编程语言。

但请注意,如果访问者在其系统上配置了电子邮件客户端(例如Outlook Express),则Mailto

为了根据需要附加屏幕截图,建议您按照here所述寻求解决方案。

或者也可以使用以下使用Javascript和HTML5的方法

  • 在HTML文件中定义标记和脚本

    <html>
    <head>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="html2canvas.js"></script>
    <script>
        function take_screenshot()
        {
            html2canvas(document.body, { onrendered: function(canvas)  
            {
                var img = canvas.toDataURL()
                $.post("save_screenshot.php", {data: img}, functio(file){            
                     window.location.href =  "save_screenshot.php?file="+ file
                });
            }
            });
         }
    </script>
    <body>
         <div id="wrapper">
             <div id="screenshot_div">
                 <button type="button" onclick="take_screenshot()">buttonText</button>
             </div>
         </div>
     </body>
    

  • 制作一个PHP文件来保存屏幕截图

    <?php
    if($_GET['file'])
    {
        $file=$_GET['file'];
        if (file_exists($file))
        {
            header('Content-Description: File Transfer');
            header('Content-Type: image/png');
            header('Content-Disposition: attachment; filename='.basename($file));
            header('Content-Transfer-Encoding: binary');
            header('Expires: 0');
            header('Cache-Control: must-revalidate, post-check=0, pre-check=0');
            header('Pragma: public');
            header('Content-Length: ' . filesize($file));
            ob_clean();
            flush();
            readfile($file);
            unlink($file);
            exit;
        }
    }
    
    if($_POST['data'])
    {
        $data = $_POST['data'];
        $file = md5(uniqid()) . '.png';
        $uri =  substr($data,strpos($data,",")+1);
        file_put_contents('./'.$file, base64_decode($uri));
        echo $file;
        exit();
    }
    ?>
    

由于我不确定您的确切程序结构,因此仅将其用作指南。要附加存储的图像,请使用我上面提到的方法附加图像。有关这方面的更多信息,请参阅this

希望这有帮助

答案 1 :(得分:3)

您可以使用mailto链接,如下所述

Mailto链接是一种HTML链接,用于激活计算机上用于发送电子邮件的默认邮件客户端。 Web浏览器需要在其计算机上安装默认的电子邮件客户端软件才能激活电子邮件客户端。 如果您使用Microsoft Outlook,例如作为默认邮件客户端,则按mailto链接将打开一个新的邮件窗口。

<a href="mailto:vinoth@email.com">Send Mail</a>

如果您想将此添加到按钮,可以尝试以下html

<button onclick="location.href='mailto:vinoth@email.com';">Send Mail</button>

关于你拍摄截图并附上邮件的第二个要求,请参考以下链接,我认为已经回答了

How to screenshot website in JavaScript client-side