@技術屋のメモ | WEB/アプリ開発技術メモ

エンジニアによるWeb・アプリ・ゲーム・SEO対策などのメモ

Javascriptで簡単に画像をアップロードできるプラグイン「jQuery.upload」

by · 公開済み · 更新済み

画像やファイルをJavascriptからアップロードするプラグインをご紹介いたします。

jQuery.uploadを使えば、アップロードするための<form>の設置も不要。

最近主流となっているページ切り替えなしのファイルアップロードが可能です。

IEでも問題なく動作するのが大きいです。(本当にWeb制作に携わっているとIEのダメさが身にしみます)

「jQuery.upload.js」のダウンロードについて

下記よりダウンロードできます。

jQuery.upload.js

http://lagoscript.org/jquery/upload

1

 

■使い方

ご利用にはjQueryを使用します。

※jQueryはJavascriptのDOM要素を簡単に使用するためのJavascriptライブラリです。

１．jQueryとダウンロードしてきたjQuery.upload.jsを読み込みます。

[html]


[/html]

ちなみにjQueryのダウンロードはこちらから

2.html上にアップロードするためのinput:fileを設置

[html]


[/html]

3．イベントを追加

下記のソースをhead内に追加いたします。
[html]

[/html]

アップロードボタンをクリックするとjQuery.uploadが呼び出されます。

jQuery.uploadの引数

jQuery(elm).upload(URL,DATA,CALLBACK,TYPE);

１．URL      ・・・・ 送信先のURL

２．DATA  ・・・・サーバに送信するデータ（配列、もしくはURL形式(“test=1&sample=2″など)）

３．CALLBACK ・・・・送信後に呼び出される関数

４．TYPE ・・・・CALLBACKの引数の形式(‘json’,’text’,’xml’,’html’,’script’)で指定

 

[amazonjs asin=”4893116487″ locale=”JP” title=”よくわかるゼロからはじめるJavaScript (よくわかるトレーニングテキスト)”]

タグ: