HTML表單教程
網站的一個共同特點是很多新的網頁設計師都在苦苦掙扎。 您可能希望將表單添加到您的網站,作為人們與您聯繫以便提出問題或對您提供的產品或服務表達興趣的簡單方式。 不幸的是,關於如何添加複雜的網站表單的在線教程可能會令人困惑,並將新的Web專業人員帶走。
即使是新的webbies,Web表單也不需要很難處理。
Mailto表單是使表單工作的一種簡單方法。 他們依靠電子郵件客戶端將表單數據從客戶的計算機發送給表單所有者。 網站用戶完成的表單數據將通過電子郵件發送到表單編碼中指定的特定地址。
如果您對網頁設計不熟悉,而且您不知道如何編程更複雜的交互,或者您正在運行一個小型網站,並且只想要一種簡單的方式來添加表單,那麼將mailto表單作為聯繫表單很重要比學習編寫PHP更容易。 這比購買預先寫好的腳本來為你做更便宜。
有了這個快速教程,學習如何使用mailto表單。 即使你以前從未這麼做,掌握這項技術也很容易,當然也是在“開始網頁設計”領域。
入門
對於新的Web開發人員來說,HTML表單可能具有挑戰性,因為它們不僅僅需要學習HTML標記。 除了創建表單及其字段所需的HTML元素之外,還必須有一些方法讓表單“工作”。 這通常需要訪問CGI腳本或其他程序以在表單的“action”屬性中創建。
該行為是表單處理數據的方式,以及之後的處理方式(寫入數據庫,發送電子郵件等)
如果您無法訪問能夠使您的表單正常工作的腳本,則大多數現代瀏覽器都支持一種表單操作。
action =“ mailto:youremailaddress ”
這是從您的網站獲取表單數據到您的電子郵件的簡單方法。
無可否認,這個解決方案的功能非常有限,但對於非常小的網站來說,這是一個很好的開始。
使用Mailto表單的技巧
使用enctype =“text / plain”屬性
這告訴瀏覽器以及電子郵件客戶端,表單發送純文本而不是更複雜。 一些瀏覽器和電子郵件客戶端發送為網頁編碼的表單數據。 這意味著數據將作為一個長行發送,空格替換為加號(+),其他字符被編碼。 使用enctype =“text / plain”屬性有助於使數據更易於閱讀。
使用GET或POST方法
雖然POST方法有時可用,但它通常只會導致瀏覽器打開空白的電子郵件窗口。 如果GET方法發生這種情況,請嘗試切換到POST。
示例Mailto表單
下面是一個使用mailto動作的示例表單(注意 - 這是非常簡單的標記,理想情況下,您可以使用更多的語義標記和元素對這些表單字段進行編碼,但本示例對本教程的範圍而言已足夠):
你的名字:
您的姓氏:
評論:
FORM>
您的客戶會看到一條消息,表明該表單正在通過電子郵件提交。 這就是結果的樣子:
如first_name =珍
姓氏= Kyrnin
評論=你好!
有關Mailto表格的特別說明
再次,這個方法雖然簡單,但也非常有限。 顯然,重要的是要注意, mailto表單並不總是適用於瀏覽器和電子郵件客戶端的所有組合。 如果您嘗試使用mailto表單並且不成功,這可能就是為什麼 - 可能會導致該功能失敗的技術組合。 有關可能干擾您嘗試使用此類表單的更多詳細信息,請參閱“ 當Mailto表單不起作用” 。
雖然這種方法是創建生成電子郵件和發送表單數據的Web表單的第一次嘗試,但隨著您在Web技能方面更先進,您一定會想要探索更強大的選項。 從CGI腳本到PHP表單到內置表單小部件的CMS平台,您都有充足的高級選項可供您考慮,以滿足您未來網站表單的需求!
Jennifer Krynin的原創文章。 由Jeremy Girard於9/12/17編輯