お世話になります。HTML5のテンプレートを使用してメールフォームを作成しようとしておりますが、なかなかうまくいきません。action=""にメールアドレスを入れてみましたが、できませんでした。どなたかお分かりの方いらっしゃいましたら、どうかよろしくお願い致します。
<form id="contact" action="contact.html" method="post">
<div class="form_settings">
<p><span>Name</span><input class="contact" type="text" name="your_name" value="" /></p>
<p><span>Email Address</span><input class="contact" type="text" name="your_email" value="" /></p>
<p><span>Message</span><textarea class="contact textarea" rows="5" cols="50" name="your_message"></textarea></p>
<p style="padding-top: 15px"><span></span><input class="submit" type="submit" name="contact_submitted" value="send" /></p>
</div>
</form>
No.3ベストアンサー
- 回答日時:
既に他の方がいうようにメールフォームなどはCGIやPHPを使うと、より便利です。
それを踏まえたうえでですが、まず、うまくいかない原因として<divタグの位置です。書き換えています。
<div class="form_settings">
<FORM action="mailto:送信先アドレス" method="POST" name="WMMailForm" enctype="text/plain" onsubmit="return WMValidationForm(this);">
<p><span>Name</span><input class="contact" type="text" name="your_name" value="" /></p>
<p><span>Email Address</span><input class="contact" type="text" name="your_email" value="" /></p>
<p><span>Message</span><textarea class="contact textarea" rows="5" cols="50" name="your_message"></textarea></p>
<p style="padding-top: 15px"><span></span><input class="submit" type="submit" name="contact_submitted" value="send" /></p>
</form>
</div>
No.2
- 回答日時:
「できない」というのは具体的にどういうことを指していますか?
デザインが思い通りにならないということでしょうか。あるいは、実際に送信して指定のメールアドレスに届かないということでしょうか?
仮に後者の意味なら、話は明快です。
フォームの送信処理は、HTMLだけではできません。
つまり、HTMLをどうこうしたところで問題は解決しません。
フォームを稼動させるには、送信を受けるサーバー側のプログラムが別途必要です。
サーバーのプログラムとは、一般的にPHPやPerlなどのHTML/CSSとは別の言語が用いられますが、一般の方がいきなり利用されるには障壁が多いと思われます。
No.1
- 回答日時:
<form action="[プログラム]" method="post|get">
・・・[プログラム]には、通信プロトコルとサーバー、プログラムファイル名が入ります。
http://hoge.com/cgi/mail.cgi
とか
../cgi/mail.cgi
ですかね。HTTPプロトコルで、そのサーバーのmail.cgiというプログラムにデータを送りつけます。
HTML4.01仕様書17.3 FORM要素 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )
HTML5の場合は、フォームに関してはdatalist要素や、多くの属性が追加されていますが、基本的には変わりません。→新しい要素 ( http://standards.mitsue.co.jp/resources/w3c/TR/h … )
★示されたテンプレートは、HTML5ではありません。というより、HTMLからは程遠い、とんでもないものです。
HTML5が、HTML4.01と、もっとも大きく変わったのは、文書構造の明確化です。これはHTML5の最も重要な根幹に関わる部分です。
すなわち
<form action="[URI]">
<div class="mailForm">
<dl>
<dt>お名前</dt>
<dd><input type="text name="name value="" size="20"></dd>
<dt>
・・・・・・・・・・・
とか、
<form action="[URI]">
<table>
<tbody>
<tr>
<th>お名前</th>
<td><input type="text name="name value="" size="20"></td>
</tr>
<tr>
<th>
・・・・・・・・・
とか、です。
<span></span>とかありえないですし、<input class="contact" のような場所にclassは不要です。HTML5が解釈できるブラウザでしたら、子孫セレクタや属性セレクタでスタイルシートは設定できます。
CGI自体については、
CGI RESCUE - CGIフリーソフト ( http://www.rescue.ne.jp/ )
→CGI RESCUE チャレンジCGI - 初心者向けミニ講座 ( http://www.rescue.ne.jp/cgi/beginners/ )
などを勉強してください。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・人生のプチ美学を教えてください!!
- ・10秒目をつむったら…
- ・あなたの習慣について教えてください!!
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・【大喜利】【投稿~9/18】 おとぎ話『桃太郎』の知られざるエピソード
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
CSSのクラス名・ID名の指定でワ...
-
外部css定義したclassをht...
-
css 記述法
-
ラジオボタンの装飾(色の違う2...
-
divでくくった中の要素にa link
-
フロートのクリアについて
-
idの中のid指定
-
スタイルシートで特定IDかつ特...
-
liリストタグの背景色に色がつ...
-
htmlの文字が縦書きになる
-
Macで画像の切り抜きできないの?
-
画像イメージの上下左右、欲し...
-
html/cssの、navを2段にする...
-
【ヒトの神秘】美男美女から何...
-
複数のボタンを等間隔に、かつ...
-
smallにtext-allignが効かない
-
HTML属性での「""」 「''」違い
-
<div align="center">を使わず...
-
改行ほどは行かないけど、若干...
-
Media Queries 4 で 非推奨とな...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
brにクラスをつけてcssでdispla...
-
HTML要素のid/class名の長さに...
-
idの中のid指定
-
htmlのid属性って必要なの?
-
サイトにjQueryが使用されてい...
-
CSSのクラス名・ID名の指定でワ...
-
個別にリンクの色を変える方法
-
透過背景を解除するにはどうす...
-
liリストタグの背景色に色がつ...
-
子孫セレクタの読み方をおしえ...
-
CSSに同じclass名がいっぱい‥。...
-
最近、HTMLのヘッダーをIDで定...
-
外部css定義したclassをht...
-
CSS, リンクの色を一部変えるに...
-
リンク文字の 一部だけ色を変...
-
display:table-cell内でこんな...
-
htmlとcssで吹き出しの中に文字...
-
同ページ内でリンクの色を変え...
-
外部スタイルシートで定義した...
-
name属性とid属性
おすすめ情報