入力ボタンと送信ボタンの違い

物語の起源:

実は、私は昨日すでにこの問題に遭遇していましたが、昨日、会社の古い従業員がインターンの私を手伝ってくれて、私もその古い従業員が違いを知らないことを確認しました（推測）。その後、今日も同じ問題に遭遇しました。

ストーリー概要:

現在、私は AngularJs フレームワークを使用して、会社でプロジェクトに取り組んでいます。上司は、プロジェクト パッケージをローカルの Tomcat サーバーにデプロイした後、フロントエンドを書き始めました。 HTMLからCSS、JavaScript（あまり使用されていません）、ブートストラップまでのコードを終了します。これで、フロントエンドの静的インターフェイスが構築されました。次に、上司が提供するインターフェイス サービスを使用してテストします。典型的なものは MVVM フレームワークであり、関連するロジック コードを作成した後、コードを見るたびにインターフェイスが無意味にジャンプします。応答が true を返した場合はオーダー インターフェイスにジャンプし、false を返した場合はログイン インターフェイスにジャンプする必要があります。つまり、それ自体にはジャンプしません。これは非常に奇妙です。次に、Chrome の開発者ツールを開いたところ、毎回作成した Angular 関数に入っていないことがわかりました。その後、ng-modelに問題がないことを確認し、入力タイプをbuttonに変更してみたところ、残念ながら問題ありませんでした。このことに疑問を感じたので、真実を知るためにこのエッセイを書きました。

この話の真実:

一般的には、入力とボタンの両方がボタンとして使用でき、両方ともバックエンド処理のためにデータをバックエンドに送信できます。

違い: ①inputは本来入力ですが、type="submit"以降は送信の役割も果たしますので、inputは送信フォームになります

リーリー

②ボタンはボタンであり、ボタンに操作を追加しないと、type="submit" onclick="xxx()" のようなものを追加するだけで、クリック時に応答がありません。 ボタン送信の役割を果たすことができますか。

リーリー

したがって、ソフトウェア設計パターンの大原則である単一責任原則に従って、ボタンとしてボタンを使用し、送信ボタンとしての入力の使用を減らし、入力ボタンをデータ入力として使用することが推奨されます。

上記の内容は、フロントエンドの学習に対するインターンの洞察から得たものです。不適切な点がございましたら、ご指摘、よろしくお願いいたします！