jQueryモバイル端末画像アップロードプレビューコンポーネントの方法分析を実現します。

この例は、jQueryがモバイル端末の画像をプレビューコンポーネントにアップロードする方法を説明する。皆さんに参考にしてあげます。具体的には以下の通りです。
前のブログ：移動端H 5ピクチャのプレビューと圧縮、基本的な機能を実現しました。今回はセットにして、フロント、バックグラウンドで使えるようにする予定です。
まず、私達はまず実現したい機能をしごきます。

プレビュー

は

を削除します。

圧縮

はサーバ

にアップロードされます。
基本機構
このようにして、私達のコンポーネント構造はあります。

;!function(window, $, undefined){
  function Upload() { };

  Upload.prototype.change = function() { };

  Upload.prototype.del = function() { };

  Upload.prototype.compress = function() { };

  Upload.prototype.submit = function() { };

}(window, jQuery)

主なAPI
次に、コンポーネントに必要ないくつかのAPIを紹介します。

FileList

````
//         FileList
document.getElementById('inputId').files
````

window.URL.reate Object URL：画像アドレスurlに関するblobフォーマット

を返します。

createImageBitmap（file）：イメージBitmapオブジェクトを返します。ファイルに関する情報

を含んでいます。

canvas.drawImage（image Bitmap）：canvas画布に画像を描き、画像のサイズをスケーリングする

。

canvas.toBlob（）：blobオブジェクトに変換し、ピクチャ品質を

に変更することができます。

FormData：アップロード画像をFormDataの例に保存し、サーバ

にアップロードする。
DEMO：https://github.com/CaptainLiao/zujian/tree/master/Upload
jQuery関連の内容について興味がある読者は、当駅のテーマを調べてもいいです。「jQuery拡張テクニックのまとめ」、「jQuery常用プラグインと使い方のまとめ」、「jQuery切り替え特効とテクニックまとめ」、「jQueryはアルゴリズムとテクニックを遍歴して総括します。」、「jQueryよくある経典効果のまとめ」、「jQueryアニメーションと特効用法のまとめ」および「jqueryセレクタの使い方のまとめ」
ここで述べたように、皆さんのjQueryプログラムの設計に役に立ちます。