戻る

JavaScriptでフォームの送信する（Formオブジェクト）

記述方法１

氏名：

MAIL：

URL：

内容：

<script>
function fncSubmit(){
	alert("送信します");
	
	//onsubmitの場合は不要
	document.frm1.submit();
}
</script>
<form name="frm1" action="http://www.yahoo.co.jp" method="POST" onsubmit="fncSubmit()">
<fieldset>
	氏名：<input name="name" type="text" value="">
</fieldset>
<fieldset>
	MAIL：<input name="mail" type="text" value="">
</fieldset>
<fieldset>
	URL：<input name="url" type="text" value="">
</fieldset>
<fieldset>
	内容：
	<textarea name="content"></textarea>
</fieldset>
<fieldset>
	<input type="submit" name="smt" value="submitで送信">
	<input type="button" name="btn" value="buttonで送信" onclick="fncSubmit()">
</fieldset>
</form>

記述方法２

氏名：

MAIL：

URL：

内容：

<script>
document.frm2.onsubmit = function(){
	alert("送信します");
}

document.frm2.btn.onclick = function(){
	alert("送信します");
	document.frm2.submit();
}
</script>
<form name="frm2" action="http://www.yahoo.co.jp" method="POST">
<fieldset>
	氏名：<input name="name" type="text" value="">
</fieldset>
<fieldset>
	MAIL：<input name="mail" type="text" value="">
</fieldset>
<fieldset>
	URL：<input name="url" type="text" value="">
</fieldset>
<fieldset>
	内容：
	<textarea name="content"></textarea>
</fieldset>
<fieldset>
	<input type="submit" name="smt" value="submitで送信">
	<input type="button" name="btn" value="buttonで送信">
</fieldset>
</form>

記述方法３

氏名：

MAIL：

URL：

内容：

<script>
document.frm3.addEventListener("submit",function(){
	alert("送信します");
});

document.frm3.btn.addEventListener("click",function(){
	alert("送信します");
	document.frm3.submit();
});
</script>
<form name="frm3" action="http://www.yahoo.co.jp" method="POST">
<fieldset>
	氏名：<input name="name" type="text" value="">
</fieldset>
<fieldset>
	MAIL：<input name="mail" type="text" value="">
</fieldset>
<fieldset>
	URL：<input name="url" type="text" value="">
</fieldset>
<fieldset>
	内容：
	<textarea name="content"></textarea>
</fieldset>
<fieldset>
	<input type="submit" name="smt" value="submitで送信">
	<input type="button" name="btn" value="buttonで送信">
</fieldset>
</form>

Copyright © 2012 YOHSUKE NAKANO