お世話になります。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.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/ )
などを勉強してください。
No.2
- 回答日時:
「できない」というのは具体的にどういうことを指していますか?
デザインが思い通りにならないということでしょうか。あるいは、実際に送信して指定のメールアドレスに届かないということでしょうか?
仮に後者の意味なら、話は明快です。
フォームの送信処理は、HTMLだけではできません。
つまり、HTMLをどうこうしたところで問題は解決しません。
フォームを稼動させるには、送信を受けるサーバー側のプログラムが別途必要です。
サーバーのプログラムとは、一般的にPHPやPerlなどのHTML/CSSとは別の言語が用いられますが、一般の方がいきなり利用されるには障壁が多いと思われます。
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>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
- HTML・CSS ただいま勉強始めたての初心者です。フォームを縦並べにしたいです。 2 2022/11/20 17:18
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
idの中のid指定
-
サイトにjQueryが使用されてい...
-
個別にリンクの色を変える方法
-
CSSに同じclass名がいっぱい‥。...
-
clear bothで回り込みがうまく...
-
CSSを使うと<IMG>タグのHSPACE...
-
:hoverで他の要素の値を変更で...
-
外部スタイルシートで定義した...
-
ページの左右の余白(枠外)に...
-
透過背景を解除するにはどうす...
-
CSSでひとつだけdisplay:none;...
-
CSSでテキストリンクの色を複数...
-
divの入れ子を多用してページを...
-
liリストタグの背景色に色がつ...
-
正規表現の検索置換でdiv内のim...
-
CSSで、DIV#hogeという記述は何...
-
htmlのid属性って必要なの?
-
CSSのタグ「#warpper」の意...
-
最近、HTMLのヘッダーをIDで定...
-
【VBA/HTML】IE画面内のページT...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
idの中のid指定
-
CSSに同じclass名がいっぱい‥。...
-
個別にリンクの色を変える方法
-
HTML要素のid/class名の長さに...
-
最近、HTMLのヘッダーをIDで定...
-
CSS, リンクの色を一部変えるに...
-
liリストタグの背景色に色がつ...
-
CSSのクラス名・ID名の指定でワ...
-
htmlのid属性って必要なの?
-
サイトにjQueryが使用されてい...
-
スタイルシートで、id属性の中...
-
リンク文字の 一部だけ色を変...
-
外部css定義したclassをht...
-
ページの左右の余白(枠外)に...
-
<span>で2重にかけているものを...
-
CSSでテキストリンクの色を複数...
-
同ページ内でリンクの色を変え...
-
CSSが効かずどのように指定すれ...
-
display:table-cell内でこんな...
-
CSSで下まで背景色を伸ばす方法
おすすめ情報