W3G

onreset属性 onsubmit属性を指定できる要素型

F

• form

onreset属性 onsubmit属性のサンプル

次のスクリプトではユーザが入力した内容を送信時に確認し、リセット時にはリセットして良いのかを確認するダイアログ（confirm）を表示します。ユーザにダイアログで実行して良いかどうかの確認を問うてから、送信やリセットされるようにしたい場合はreturn構文を用いる必要があることに注意してください。onreset属性, onsubmit属性にreturn構文が併用されていなければ、リセットや送信が即座に実行されてしまうことになります。

<script type="text/javascript">
function check() {
item1="スポーツ：";
for(i=0;i<3;i++) {
if(document.sample.sport[i].checked){
item1=item1+document.sample.sport[i].value;} }
item2="音楽：";
for(i=0;i<3;i++){
if(document.sample.music[i].checked){
item2=item2+document.sample.music[i].value;} }
item3="映画：";
slct=document.sample.movie.selectedIndex;
item3=item3+document.sample.movie.options[slct].value;
item4="最後に一言："+document.sample.comment.value;
return confirm(item1+"\n"+item2+"\n"+item3+"\n"+item4);}
</script>
...
<form name="sample" action="xxx.cgi"
onsubmit="return check2()"
onreset="return confirm('内容をリセットしても良いですか？');">
<p>好きなスポーツ:
<input type="radio" name="sport" value="サッカー">サッカー
<input type="radio" name="sport" value="野球">野球
<input type="radio" name="sport" value="テニス">テニス</p>
<p>好きな音楽:
<input type="radio" name="music" value="クラッシック">クラッシック
<input type="radio" name="music" value="ポップス">ポップス
<input type="radio" name="music" value="ロック">ロック</p>
<p>好きな映画: <select name="movie">
<option value="洋画">洋画</option>
<option value="邦画">邦画</option>
</select></p>
<p>最後に一言: <input type="text" name="comment"></p>
<p><input type="submit" value="送信">
<input type="reset" value="リセット"></p>
</form>