検索

ホームページ  >  に質問  >  本文

JavaScript - HTML5 複数画像のアップロード

これは、jquery で複数の画像をアップロードするデモをダウンロードする方法です。しかし、私には彼の実装アイデアが理解できません。
< br>私が知りたいのは、彼がどのようにして写真をページにアップロードし、クリックしてアップロードを開始し、その後すべてを一度にアップロードするのかということです。アイデアを整理するのを手伝っていただけますか。

このデモのオンライン デモへのリンクは http://www.jq22.com/yanshi1604 です。

習慣沉默習慣沉默2826日前567

全員に返信(3)返信します

  • 怪我咯

    怪我咯2017-05-16 13:04:56

    私はそう思います:

    1. file属性のinputタグでファイルを選択できます。

    2. ファイルを選択した後、input の files 属性を通じて FileList オブジェクトにアクセスします。このオブジェクトには、ファイルの最終変更時刻、ファイル名、ファイル サイズ、ファイル タイプなどの情報が含まれています。ここで、転送されるファイルのサイズを制限できます。上記のデモでは、同じファイルのアップロードを防ぐためにファイル名比較を使用する必要があります。

    3. FileReaderオブジェクトのreadAsDataURL()メソッドを使用して、画像に対応するbase64エンコーディングを取得し、このbase64をsrc属性値として持つimg要素をbox内に作成することで画像プレビュー機能を実現します。

    4. アップロード ボタンをクリックし、AJAX 経由でバックグラウンドにアップロードします。

    より完全な概要については、この記事をお読みください。もう少し簡単にまとめたい場合は、私がまとめたメモを参照してください。

    返事
    0
  • 滿天的星座

    滿天的星座2017-05-16 13:04:56

    複数の写真がある場合は、要素を配列に入れて一緒に渡します

    返事
    0
  • 阿神

    阿神2017-05-16 13:04:56

    それを配列に入れて、fileを使用して一緒に渡すだけです

    返事
    0
  • キャンセル返事