Talking about the practical application of html mailto (email)

As we all know, mailto is a very practical HTML tag in web design and production. Many friends who have personal web pages like to write their email addresses in a conspicuous position on the website, so that once the web browser clicks the hyperlink composed of mailto with the mouse, it can automatically open the default email client software in the current computer system, such as OutLook Express and Foxmail.

However, due to the inconsistency between the operating systems and mail clients in handling mailto event connections, you need to be careful when using it in practice;

1. Basic grammar

<a href=mailto:[email protected]>send email</a>

or

<form action="mailto:[email protected]">

</form>

Parameter list:

to	Recipients (separate multiple recipients with ;)
suject	theme
cc	Cc
bcc	Blind copy
body	Content (some email clients support HTML format statements)

The parameter transfer method is the same as the value transfer between pages. You can use a link string or a form

Connection String

<a href="mailto:[email protected]?subject=testtitle&[email protected]&body=this is body">send mail</a>

Form

Copy code

The code is as follows:

2. Differences between email clients

The above is a simple syntax application of mailto; however, in actual application, different browser clients may have different effects depending on the browser settings.

Especially when the body content contains HTML format statements, you need to pay attention to this;

Outlook displays the HTML statements in the body as they are (even if the HTML in the body is escaped, it is still invalid). So what should we do if we want to wrap the statements in the body when using Outlook Mailto? <br/> has no effect. . The %0D character is required as a line break symbol;

Foxmail will display the corresponding HTML effect of the HTML statement in the body;

Of course, you can also use another method to implement the mailto type client to send emails:

Copy code

The code is as follows:

function SendMail(filePath) {
var path = location.href.substring(0, location.href.lastIndexOf("/")) + filePath;
var outlookApp = new ActiveXObject("Outlook.Application");
var nameSpace = outlookApp.getNameSpace("MAPI");
var mailItem = outlookApp.CreateItem(0);
var mailto = "[email protected]";
var mailBody= "<HTML><BODY><DIV><FONT color='red'>test this is body html</FONT></DIV></BODY></HTML>";
mailItem.Subject = "test title";
mailItem.To = mailto;
mailItem.HTMLBody = mailBody;
if (path != "") {
mailItem.Attachments.Add(path);
}
mailItem.Display(0);
mailItem = null;
nameSpace = null;
outlookApp = null;
}

But this has a big disadvantage: it only supports Outlook clients, and requires the configuration of Internet options, and "Initialize and script ActiveX controls not marked as safe" must be enabled.

Calling mailItem's Attachments.Add is to add attachments to the email. If there is no attachment, the filePath parameter can be deleted.

If you need to add a carbon copy object, you can call mailItem.Cc. If you need to add a blind copy object, you can call mailItem.Bcc.

<<: The "3I" Standards for Successful Print Advertising

>>: Basic reference types of JavaScript advanced programming

Web interview Vue custom components and calling methods

Talking about the practical application of html mailto (email)

Web interview Vue custom components and calling methods

Analysis of the event loop mechanism of js

React implements the principle analysis of the three stages of loading, loading, completion, loading failure

How to install docker using YUM

Basic knowledge points of mysql worm replication

How to clear the cache after using keep-alive in vue

Mac installation mysqlclient process analysis

13 Most Frequently Asked Vue Modifiers in Interviews

Solution to the problem that the Vue page image does not display

Vue3 manual encapsulation pop-up box component message method

Recommend

MySQL 8.0.18 deployment and installation tutorial under Windows 7

Util module in node.js tutorial example detailed explanation

Basic notes on html and css (must read for front-end)

Explanation of using if judgment conditions in sum and count functions when using SQL statements to collect data

How to modify the firewall on a Linux server to allow remote access to the port

js handles account logout when closing the browser

Why do code standards require SQL statements not to have too many joins?

Detailed explanation of how to customize the style of CSS scroll bars

Detailed explanation of the difference between device-width and width in CSS3 media queries

VMware configuration hadoop to achieve pseudo-distributed graphic tutorial

CSS+HTML to implement Skeleton Screen loading placeholder animation effect (with animation)

Common naming rules for CSS classes and ids

Complete steps to implement face recognition login in Ubuntu

Book page turning effects made with CSS3

MySQL optimization: use join instead of subquery