1. ホーム
  2. html

[解決済み] HTMLフォームに複数の送信ボタンがある場合、1つのボタンをデフォルトとして指定する [重複] 。

2022-06-30 10:06:30

質問

以下のような3つの送信ボタンがあるフォームがあります。

<input type="submit" name="COMMAND" value="&lsaquo; Prev">
<input type="submit" name="COMMAND" value="Save">
<input type="reset"  name="NOTHING" value="Reset">
<input type="submit" name="COMMAND" value="Next &rsaquo;">
<input type="button" name="NOTHING" value="Skip &rsaquo;" onclick="location = 'yada-yada.asp';">

ボタンの列は、サブミット、リセット、JavaScriptのボタンが混在しています。ボタンの順序は変更される可能性がありますが、いずれにせよ保存ボタンはprevとnextボタンの間に残ります。

ここで問題なのは、ユーザーが Enter を押してフォームを送信すると、ポスト変数 "COMMAND" に "Prev" が含まれています。しかし、私は、ユーザーが Enter ボタンでフォームを送信したときにトリガーされるようにしたいのです。これは、その前に他のボタンがあるにもかかわらず、それをデフォルトの送信ボタンとして設定するようなものです。

どのように解決するのですか?

私の提案は、この動作と戦わないことです。フロートを使って効果的に順序を変更することができます。例えば

<p id="buttons">
<input type="submit" name="next" value="Next">
<input type="submit" name="prev" value="Previous">
</p>

を使っています。

#buttons { overflow: hidden; }
#buttons input { float: right; }

は効果的に順序を逆転させるので、"Next" ボタンはエンターキーを押すことによってトリガされる値になります。

この種のテクニックは、より厄介なJavaScriptの方法に頼ることなく、多くの状況をカバーします。