jQuery.uploadプラグインというAjaxでファイルをアップロードする時に重宝するjQueryのプラグインがあります。

このプラグインは2013年の最終更新以降開発が止まっているのですが、


SOY Shopで利用していて、

他のプラグインに置き換えるのが面倒だったため、

現在のjQueryのバージョンでも動作するように修正してみた。


下記が今回の修正の際のバージョン

jQuery 3.3.1

jQuery.upload 1.0.9

jQuery.upload | jQuery Plugin Registry


下記URLのUsageに従ってjQuery.uploadの設置を行って実行してみると、

https://github.com/bassjobsen/jqueryupload/


Uncaught TypeError: a.indexOf is not a function

というエラーになって止まった。


該当するコードを確認してみると、

form.submit(function() {
	iframe.load(function() {
		//コードは省略
	});
}).submit();

このコードのiframe.load(function(){});に問題があるらしい。

jQueryの仕様を調べてみると、jQueryのオブジェクトでloadメソッドが廃止されたらしい。

.load() | jQuery API Documentation


というわけで、

form.submit(function() {
	iframe.on('load', function() {
		//コードは省略
	});
}).submit();

onメソッドにloadイベントとして登録するように書き換えてみたら、

無事動作するようになった。


追記

この記事投稿後にプルリクが採用されましたので、

jQuery.uploadをjQuery3系で利用したい方は本家のコードをご利用ください。

https://github.com/bassjobsen/jqueryupload/