こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

締切り済みの質問

JSのみで入力→確認→メールで送信させるには

以下の流れのフローをJSのみで、DBを使わず作成したいのですが・・・
1.入力画面(ブランクチェック)→2.入力内容確認画面(戻る、送信ボタン)→3.完了画面
2.の入力内容はメールで送信させたいです。

以下、試みているのですが、うまくいきません・・・(;;)
すみません、どなたか助けていただけますでしょうか。。。m(_ _)m

<HTML>
<HEAD>
<!-- script type="text/javascript" src="test.js"></script --><!-- メールでフォームのデータを送信する -->
<script type="text/javascript" src="check.js"></script>
<link href="design.css" rel="stylesheet" type="text/css">
<TITLE>データ送信テスト</TITLE>
</HEAD>

<body onload="init()">

<FORM NAME="form1" METHOD="post" ACTION="" ENCTYPE="text/plain" OnSubmit="CheckData(this.form1)">
<TABLE>


<TR VALIGN="top">
<TD>お名前</TD>
<TD><INPUT TYPE="text" SIZE=50 NAME="username" ID="username"></TD>
</TR>

<TR VALIGN="top">
<TD>メール本文</TD>
<TD>
<TEXTAREA NAME="message" COLS=50 ROWS=5 WRAP="virtual" ID="message">
</TEXTAREA>
</TD>
</TR>

<TR>
<TD></TD>
<TD>
<!-- input type="button" value="内容確認" onclick="WriteMail(this.form)" -->
<INPUT TYPE="submit" VALUE="送信内容確認">
<INPUT TYPE="reset" VALUE="クリア">
</TD>
</TR>

</TABLE>
</FORM>
</body>
</HTML>

function init(){
username = document.form1.getElementById("username");
message = document.form1.getElementById("message");

//入力内容確認
function CheckData() {
var okflg;

okflg = 0;

if(username.length == 0){
datacheck(1);
okflg = 1;
}
if(message.length == 0){
datacheck(5);
okflg = 5;
}

try{
if(okflg == 0) {
document.form1.location = "04.html";
}
catch(error){
alert(error.number + "\n" + error.description);
}
}
}

function dataCheck(flag){
//データをチェックする関数
var tempStr = "は必ず入力してください。";

if (flag == 1) {
alert("お名前" + tempStr);
return false;
}
if (flag == 5) {
alert("メッセージ" + tempStr);
return false;
}

return true;
}
//データ送信
function WriteMail() {
try{
if(dataCheck()) {
document.form2.action = "mailto:test@test.co.jp";
contents = ('?subject=' + document.form2.sbj.value);
}
}catch(error){
alert(error.number + "\n" + error.description);
}
}

HTMLとJSを分けており、次の画面でメール送信させたいのですが・・
考え方としてあっていますでしょうか?

投稿日時 - 2009-12-03 09:27:32

QNo.5494362

すぐに回答ほしいです

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(2)

ANo.2

試したところ、submitされました。

確認メッセージが出たあと、送信されました。
alert("よんでる");があると2回ボタンを押さないとダメなようでしたので
コメントアウトして試しました。

OutlookExpress以外のメーラーではどうなるのかわかりませんが・・

大変申し訳ございませんが、この投稿に添付された画像や動画などは、「BIGLOBEなんでも相談室」ではご覧いただくことができません。 OKWAVEよりご覧ください。

マルチメディア機能とは?

投稿日時 - 2009-12-04 14:48:32

お礼

わざわざありがとうございました。
大変参考になりました。m(_ _)m

投稿日時 - 2009-12-07 10:07:46

ANo.1

javascriptでメールを出せるのはブラウザやメーラーなど環境に依存し
不正確きわまりないためやめた方がいいでしょう。

やるならサーバーのメール機能をつかったものにすべきだと思います

投稿日時 - 2009-12-03 10:21:58

補足

的確なアドバイス、ありがとうございます。
そのようにいたしますが、その説得のためにも動かしたいと思います。
サブミットされないのですが、どうしてでしょうか。。。
申し訳ありませんが、ご意見いただければ幸いです。m(_ _)m

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<script>
function formload(){
var params = getParameter(decodeURI(location.search));
var str ="";
for(i=0; i < params.length; i++)
{
switch (i) {
case 0:
str += "お名前:" + params[i] + "<br>";
break;
case 1:
str += "メールアドレス:" + params[i] + "<br>";
break;
case 2:
str += "表題:" + params[i] + "<br>";
break;
case 3:
str += "本文:" + params[i] + "<br>";
//str += params[i] + "<br>";
break;
default:
break;
}
document.form2.message.value += params[i] + "\n";
}
// ここの段階で入力チェックをまとめてやっても良い
document.getElementById("result").innerHTML = "入力内容確認:<br>" + str;
}
// Query String から 配列を返す
function getParameter(str){
var dec = decodeURIComponent;
var par = new Array, itm;
if(typeof(str) == 'undefined') return par;
if(str.indexOf('?', 0) > -1) str = str.split('?')[1];
str = str.split('&');
for(var i = 0; str.length > i; i++){
itm = str[i].split("=");
if(itm[0] != ''){
//par[itm[0]] = typeof(itm[1]) == 'undefined' ? true : dec(itm[1]);// 名前を添え字とする場合に有効にする
par[i] = typeof(itm[1]) == 'undefined' ? true : dec(itm[1]);
}
}
return par;
}
function WriteMail() {
alert("よんでる");
document.form2.action = "mailto:tamakosato@.co.jp";
contents = ('?subject=' + "テストメール");
//contents = ((document.mailer.who.options[document.mailer.who.selectedIndex].value) );
}

</script>
<link href="design.css" rel="stylesheet" type="text/css">
</HEAD>
<body onload="formload();" >
<title>test02-受信側</title>
<form name="form2" method="post" action="" enctype="text/plain" OnSubmit="(document.form2.action += contents)">
<div id="result"></div>
<br><br>
<!-- input type=button value="メール送信" onClick=""/ -->
<TABLE>

<!--TR VALIGN="top">
<TD>あなたの名前</TD>
<TD>
<div ID="username"></div>
<input type="hidden" id="username_h" value="" OnChange="WriteMail(this.form)">
</TD>
</TR>

<TR VALIGN="top">
<TD>あなたのアドレス</TD>
<TD><INPUT TYPE="text" SIZE=50 NAME="email" OnChange="WriteMail(this.form)"></TD>
</TR>

<TR VALIGN="top">
<TD>優先度</TD>
<TD>
<SELECT NAME="priority" OnChange="WriteMail(this.form)">
<OPTION VALUE="normal">普通
<OPTION VALUE="urgent">高
</SELECT>
</TD>
</TR>

<TR VALIGN="top">
<TD>表題</TD>
<TD><INPUT TYPE="text" NAME="sbj" OnChange="WriteMail(this.form)"></TD>
</TR -->

<TR VALIGN="top">
<TD>上記内容でよろしければ、「メール送信」ボタンをクリックしてください</TD>
<TD>
</TD>
</TR>

<TR>
<TD><textarea name="message" cols=50 rows=5 wrap="virtual" onchange="WriteMail(this.form)" id="message">
</textarea>
</TD>
<TD>
</TD>
</TR>
<TR>
<TD><INPUT TYPE="submit" VALUE="メール送信">
<INPUT type="button" value="入力内容を修正" onClick="history.back()">
</TD>
<TD></TD>
</TR>
</TABLE>
</FORM>
</body>
</HTML>

投稿日時 - 2009-12-03 19:24:03

あなたにオススメの質問