jquery - ユーザーが「開く」をクリックしたときにファイル入力フォームをアップロードする

Question

この流れが可能かどうか疑問に思っています：

1. 「アップロード」と書かれたボタンをクリックします。通常とはかなり異なるスタイルです。「ファイルが選択されていません」というテキストは表示されません。

2. 通常のファイル ブラウザが開きます。ユーザーはアップロードするファイルを選択します。ファイルブラウザの「開く」ボタンをクリックします。

3. [開く] をクリックすると、ファイル ブラウザが閉じられ (通常と同様)、ファイルのアップロードがすぐに開始されます (送信が必要な通常とは異なります)。

4. ファイルのアップロードが完了したことを検出し、別のページに誘導します。

これを実装しようとする方法は次のとおりです。

1. 入力ボタンのカスタム CSS - これは難しくないようです。
2. 変更は必要ありません
3. 入力値が変化したことを検出します。変更されたことを検出したら、送信をトリガーします。
4. ???? ファイルのアップロードが完了したことを検出するにはどうすればよいですか?

Answer 1

フォーム送信を使用する場合、(POST の可能性が高い) 要求が完了すると、ファイルのアップロードが終了します。

入力値が変化したときに送信をトリガーするにはform.submit()、JavaScript で使用します。

$('#file_input').change(function() {
    $(this).closest('form').submit();
});

サーバーは応答としてリダイレクトを返す必要があります (例: ステータス コード 301、302、303 など)。