簡體   English   中英

HTML:通過默認電子郵件客戶端選擇性地發送電子郵件

[英]HTML: Send email selectively through default email client

以下是我的代碼示例。

基本上,我試圖通過使用計算機的默認電子郵件客戶端在網頁上發送電子郵件,而不使用HTML以外的任何內容。

到目前為止,一切正常。

填寫信息后,“發送消息”按鈕將在計算機的默認電子郵件客戶端中為用戶編寫電子郵件。

但是,我有多個要使用的電子郵件地址。 我的代碼允許我將電子郵件發送到所有電子郵件,但是我希望允許用戶選擇要發送到的電子郵件,而無需使用php或asp之類的東西。 我想讓它盡可能“簡單”。

有人對如何使選擇與我的代碼一起使用有任何想法嗎?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title>EMAIL</title>
</head>

<body>
    <form method="post" action="mailto:...@email.com; ...@email.com" enctype="text/plain">
        <select name="carlist" form="carform">
            <option value="...@email.com">person1</option>
            <option value="...@email.com">person2</option>
        </select>

        <div>
            <div>
                <input name="name" placeholder="Name" type="text" class="text" />
            </div>
            <div>
                <input name="email" placeholder="Email" type="text" class="text" />
            </div>
        </div>
        <div class="row half">
            <div>
                <textarea name="message" placeholder="Message"></textarea>
            </div>
        </div>
        <div>
            <div ">
                                                <ul class="actions ">
                                                    <li><input type="submit " class="button " value= "Send Message "></li>
                                                    <li><input type="reset " class="button " value= "Clear Forum "></li>
                                                </ul>
                                            </div>
                                        </div>
                                    </form>

    </body>

    </html>

在回答有關添加更多jquery或javascript的評論時:是的,只要您注意不要覆蓋全局變量等,就可以包括更多內容。這是我的建議。 你有:

<form method="post" action="mailto:...@email.com; ...@email.com" enctype="text/plain">
    <select name="carlist" form="carform">
        <option value="...@email.com">person1</option>
        <option value="...@email.com">person2</option>
    </select>

我將<select>更改為具有onChange屬性-每當下拉列表的值發生更改時,此屬性都會觸發一些操作-我們將提供如下所示的javascript操作:

<select name="carlist" form="carform" onChange="updateForm();" id="carlist">

我給了它一個id ,以使其更容易在javascript中選擇。 我們將在此處對您的<form>標簽執行相同的操作:

<form method="post" action="etc" enctype="text/plain" id="mainForm">

然后,在您的<form>標記上方,將以下<script>標記放置:

<script type="text/javascript>
function updateForm(){
    var email=document.getElementById("carlist").value;
    document.getElementById("mainForm").action="mailto:"+email;
}
</script>

然后,只要下拉列表發生更改,JavaScript就會自動將<form action更新為具有mailto: value of the dropdown

最后,開始的代碼塊:

<form method="post" action="mailto:...@email.com; ...@email.com" enctype="text/plain">
    <select name="carlist" form="carform">
        <option value="...@email.com">person1</option>
        <option value="...@email.com">person2</option>
    </select>

會停:

<script type="text/javascript>
function updateForm(){
    var email=document.getElementById("carlist").value;
    document.getElementById("mainForm").action="mailto:"+email;
}
</script>
<form method="post" action="mailto:...@email.com; ...@email.com" enctype="text/plain" id="mainForm">
    <select name="carlist" form="carform" onChange="updateForm();" id="carlist">
        <option value="...@email.com">person1</option>
        <option value="...@email.com">person2</option>
    </select>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM