これは、jquery で複数の画像をアップロードするデモをダウンロードする方法です。しかし、私には彼の実装アイデアが理解できません。 < br>私が知りたいのは、彼がどのようにして写真をページにアップロードし、クリックしてアップロードを開始し、その後すべてを一度にアップロードするのかということです。アイデアを整理するのを手伝っていただけますか。
このデモのオンライン デモへのリンクは http://www.jq22.com/yanshi1604 です。
私はそう思います:
file属性のinputタグでファイルを選択できます。
ファイルを選択した後、input の files 属性を通じて FileList オブジェクトにアクセスします。このオブジェクトには、ファイルの最終変更時刻、ファイル名、ファイル サイズ、ファイル タイプなどの情報が含まれています。ここで、転送されるファイルのサイズを制限できます。上記のデモでは、同じファイルのアップロードを防ぐためにファイル名比較を使用する必要があります。
FileReaderオブジェクトのreadAsDataURL()メソッドを使用して、画像に対応するbase64エンコーディングを取得し、このbase64をsrc属性値として持つimg要素をbox内に作成することで画像プレビュー機能を実現します。
アップロード ボタンをクリックし、AJAX 経由でバックグラウンドにアップロードします。
より完全な概要については、この記事をお読みください。もう少し簡単にまとめたい場合は、私がまとめたメモを参照してください。
複数の写真がある場合は、要素を配列に入れて一緒に渡します
それを配列に入れて、fileを使用して一緒に渡すだけです
< br>私が知りたいのは、彼がどのようにして写真をページにアップロードし、クリックしてアップロードを開始し、その後すべてを一度にアップロードするのかということです。アイデアを整理するのを手伝っていただけますか。 
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
私はそう思います:
file属性のinputタグでファイルを選択できます。
ファイルを選択した後、input の files 属性を通じて FileList オブジェクトにアクセスします。このオブジェクトには、ファイルの最終変更時刻、ファイル名、ファイル サイズ、ファイル タイプなどの情報が含まれています。ここで、転送されるファイルのサイズを制限できます。上記のデモでは、同じファイルのアップロードを防ぐためにファイル名比較を使用する必要があります。
FileReaderオブジェクトのreadAsDataURL()メソッドを使用して、画像に対応するbase64エンコーディングを取得し、このbase64をsrc属性値として持つimg要素をbox内に作成することで画像プレビュー機能を実現します。
アップロード ボタンをクリックし、AJAX 経由でバックグラウンドにアップロードします。
より完全な概要については、この記事をお読みください。もう少し簡単にまとめたい場合は、私がまとめたメモを参照してください。
複数の写真がある場合は、要素を配列に入れて一緒に渡します
それを配列に入れて、fileを使用して一緒に渡すだけです