
例えば
index.php:
<?php
$self=$_SERVER['SCRIPT_NAME'].'?'.htmlspecialchars(SID);
print<<<EOL
<form method="post" action="{$self}">
<input type="text" name="tx1" value="txval1"/>
<input type="text" name="tx2" value="txval2"/>
<input type="submit" name="sb1" value="sbval1"/>
<input type="submit" name="sb2" value="sbval2"/>
<br/><br/>
<br/><br/>
text1={$_POST['tx1']}<br/>
text2={$_POST['tx2']}<br/>
submit1={$_POST['sb1']}<br/>
submit2={$_POST['sb2']}<br/>
<br/><br/>
<br/><br/>
</form>
EOL;
?>
においてtx1入力ボックスにフォーカスをしエンターキーを叩くと
sb1ボタンを押したときと同じ出力が得られます
tx1入力ボックスにフォーカスをしエンターキーを叩いたときに
sb1ボタンでなくsb2ボタンを押したときの出力にするにはどうしたらいいでしょうか?
つまり今は
tx1入力ボックスにsb1ボタンが紐づいていますが
tx1入力ボックスにsb2ボタンが紐づくようにしたいのですが
どうしらいいでしょうか?
No.1ベストアンサー
- 回答日時:
こんにちは
>tx1入力ボックスにsb1ボタンが紐づいていますが
紐づいているわけではないと思います。
単に、input要素でEnterを押すとformがsubmitされるという仕様に基づいているだけではないでしょうか。
submit要素が複数ある場合の挙動について、仕様書にあるのかを調べてはいませんけれど、ブラウザ依存かもしれません。
(ご提示の例では、先に記述のあるサブミットが優先されているものと想像されます)
>tx1入力ボックスにsb2ボタンが紐づくようにしたいのですが
ひとつの方法として、
<form1>
<text1>
<text2>:非表示
<sumit2>
</form1>
と
<form2>
<text1> :非表示
<text2>
<sumit1>
</form2>
に分けて記述しておき、
・CSSで表示順を希望するように調整
・それぞれの要素でsubmitされた際に、hidden要素の値をスクリプト等で整合させて修正する。
などとしておけば、実現できそうに思われます。
一方で、どうせスクリプトを利用するのであれば、ご提示のHTMLのままでも「tx1でEnterが押されたら、sb2をクリックする」という処理を加えるだけでも良さそうに思います。
(こちらであれば、レイアウトを調整する必要はなくなりますし。)
・・・ということで、HTMLの</form>の記述より後に、以下の、<script>~</script>の記述を追加してみて下さい。
※ 文書の全体構成が不明なので、ご提示の文書用に最低限の記述になっています。
文書が複雑な場合は、セレクタ等の修正が必要と思われますのでご注意。
<script>
document.querySelector('form').addEventListener('keydown', function(e){
if(e.target.name == 'tx1' && e.key=='Enter'){
e.preventDefault();
e.target.form.elements['sb2'].click();
}
});
</script>
No.2
- 回答日時:
No1です
>複数テキストに記載された全てのデータを取得して処理したいのでNGです
ですので、No1には、
>hidden要素の値をスクリプト等で整合させて修正する。
と書きました。
(まぁ、スクリプトを利用することに変わりはありませんけれど・・・)
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- PHP 入力した部分を表示させたまま(保持)するにはどうすれば良いでしょうか? 1 2023/01/25 11:14
- PHP PHPで画像の渡しが上手く行きません。 1 2023/02/02 09:39
- PHP PHPのエラーの解消法について教えて下さい。 1 2023/02/06 10:48
- PHP PHPでユーザー情報を入力して簡易ログイン機能をつくってみたのですが 1 2023/05/29 08:51
- HTML・CSS 私の能力からして間違っていないような気がします。 4 2022/09/30 13:24
- CGI htmlからパラメータで、cgiに渡したい。 1 2023/02/06 16:15
- JavaScript javascriptのちょっとした動作不良(原因は突き止めたのですが) 1 2023/06/15 19:58
- PHP PHPでCookieを使った訪問回数について 1 2023/05/28 14:10
- PHP php ログイン 1 2022/11/01 00:24
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
<input type="hidden" >で配列...
-
画面が更新されてもチェックボ...
-
配列をhiddenで
-
テキストボックスに初期値を入れる
-
PHP・MYSQLで複数のチェックボ...
-
PHPでフォームに表示させたCSV...
-
ラジオボタンをsessionで使いたい
-
テキストボックスとsubmitボタ...
-
フォームでのリセットを使う方法
-
HTMLのリンクをクリックするこ...
-
$_SESSIONについて教えて下さい。
-
同じページでフォームデータを...
-
phpの問題でIF文を用いて、成績...
-
CAKEPHPでビューからコントロー...
-
POSTデータのNAME属性をVALUEに...
-
phpでのボタン押下の活性・非活...
-
PHP チェックボックスのhidden...
-
HTMLで前の画面に戻る時、入力...
-
PHPで画像の渡しが上手く行きま...
-
検索時の選択内容を保持する方法
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
検索時の選択内容を保持する方法
-
HTMLで前の画面に戻る時、入力...
-
同じページでフォームデータを...
-
PHPで、ボタンを押すと同じペー...
-
フォームボタンを押すたびに数...
-
フォームへの前回入力値をクリ...
-
DBの値をチェックボックスに反...
-
チェックボックスによる検索
-
HTMLフォームで複数選択のチェ...
-
フォームでのリセットを使う方法
-
エラーを元の画面に表示させるには
-
PHP ボタンが押されたら処理を...
-
チェックボックスの必須項目指定
-
【PHPチェック】ラジオボタンが...
-
POSTやGETの変数をフォーム無し...
-
PHPでクリックするたびに変数を...
-
入力した部分を表示させたまま...
-
ラジオボタンをsessionで使いたい
-
POSTデータのNAME属性をVALUEに...
-
アップロードの際にファイルパス
おすすめ情報
回答ありがとうございます
複数フォームに分割してしまうと
複数テキストに記載された全てのデータを取得して処理したいのでNGです
スクリプトでやる方法は最後の手段として考えます
複数のsubmitボタンを1つのフォームに配置して場合に
フォーム内のどのテキストボタンをクリックしても最初に記載されているsubmitボタンを
プッシュしたことになるのが少なくともfirefox,ie,edgeの動作のようです
この規則を変更する方法(特定のテキストと特定のボタンを紐づける方法)が
htmlの仕様にあればよいのですが
一つのフォームに1つのsubmitボタンだけがある想定でhtmlが作成されているのかもしれません
しかしテキストエンターをしないという前提ならば複数ボタンの使用は価値があるのでこれを使わないわけにはいきません