PHP Ajax アップロードファイルの例 [ajaxfileupload.js]_PHP チュートリアル

jquery ajax と php を使用して画像をアップロードする方法について説明しました。次に、php ajax を使用して、更新せずにさまざまなファイルをアップロードする方法を紹介します。これがすべての学生に役立つことを願っています。

一括で追加・アップロードできるので簡単で便利です

コードは次のとおりです コードをコピー

jQuery.extend({

createUploadIframe: function(id, uri) { //フレームを作成 var FrameId = 'jUploadFrame' + id; var iframeHtml = ' If(window.ActiveXObject) { If(uri のタイプ== 'ブール'){ iframeHtml += ' src="' + 'javascript:false' + '"';

} else if(typeof uri== 'string'){ iframeHtml += ' src="' + uri + '"';

} iframeHtml += ' />'; jQuery(iframeHtml).appendTo(document.body);

return jQuery('#' + FrameId).get(0); }、 createUploadForm: function(id, fileElementId, data) { //フォームを作成する var formId = 'jUploadForm' + id; var fileId = 'jUploadFile' + id; var form = jQuery(' '); if(データ) { for(データ内の変数 i) { jQuery(' ').appendTo(form); var oldElement = jQuery('#' + fileElementId); var newElement = jQuery(oldElement).clone(); jQuery(oldElement).attr('id', fileId); jQuery(oldElement).before(newElement); jQuery(oldElement).appendTo(form);

// 属性を設定します jQuery(フォーム).css('位置', '絶対'); jQuery(フォーム).css('top', '-1200px'); jQuery(フォーム).css('left', '-1200px'); jQuery(フォーム).appendTo('body'); 返品フォーム; }、

ajaxFileUpload: 関数 { // TODO はグローバル設定を導入し、クライアントがタイムアウトだけでなくすべてのリクエストに対して設定を変更できるようにします s = jQuery.extend({}, jQuery.ajaxSettings, s); var id = new Date().getTime() var form = jQuery.createUploadForm(id, s.fileElementId, (typeof(s.data)=='未定義'?false:s.data)); var io = jQuery.createUploadIframe(id, s.secureuri); var FrameId = 'jUploadFrame' + id; var formId = 'jUploadForm' + id; // 新しいリクエストのセットに注目してください if ( s.global && ! jQuery.active++ ) { jQuery.event.trigger( "ajaxStart" ); } var requestDone = false; // リクエストオブジェクトを作成します var xml = {} if ( s.global ) jQuery.event.trigger("ajaxSend", [xml, s]); // 応答が返ってくるまで待ちます var UploadCallback = function(isTimeout) { var io = document.getElementById(frameId); 試してみてください { if(io.contentWindow) { xml.responseText = io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null; xml.responseXML = io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document; }else if(io.contentDocument) { xml.responseText = io.contentDocument.document.body?io.contentDocument.document.body.innerHTML:null; xml.responseXML = io.contentDocument.document.XMLDocument?io.contentDocument.document.XMLDocument:io.contentDocument.document; } }キャッチ(e) { jQuery.handleError(s, xml, null, e); } if ( xml || isTimeout == "タイムアウト") { requestDone = true; var ステータス; 試してみてください{ status = isTimeout != "タイムアウト" ? "成功" : "エラー"; // リクエストが成功したか、変更されていないことを確認します if ( ステータス != "エラー" ) { // データを処理します (コールバックに関係なく httpData を通じて XML を実行します) var data = jQuery.uploadHttpData( xml, s.dataType ); // ローカル コールバックが指定されている場合は、それを起動してデータを渡します if ( s.success ) s.success( データ, ステータス ); // グローバル コールバックを起動します if( s.global ) jQuery.event.trigger( "ajaxSuccess", [xml, s] ); 他 jQuery.handleError(s, xml, status); } キャッチ(e) { ステータス = "エラー"; jQuery.handleError(s, xml, status, e); }

// リクエストは完了しました if( s.global ) jQuery.event.trigger( "ajaxComplete", [xml, s] );

// グローバル AJAX カウンターを処理します if ( s.global && ! --jQuery.active ) jQuery.event.trigger( "ajaxStop" );

// 処理結果 if ( s.complete ) s.complete(xml, ステータス);

jQuery(io).unbind()

setTimeout(function() { 試してみましょう { jQuery(io).remove(); jQuery(フォーム).remove(); } キャッチ(e) { jQuery.handleError(s, xml, null, e); }

}, 100)

xml = null

} } // タイムアウトチェッカー if ( s.timeout > 0 ) { setTimeout(function(){ // リクエストがまだ発生しているかどうかを確認します if( !requestDone ) UploadCallback( "タイムアウト" ); }, s.timeout); } 試してみてください {

var form = jQuery('#' + formId); jQuery(form).attr('action', s.url); jQuery(フォーム).attr('メソッド', 'POST'); jQuery(form).attr('target', FrameId); if(フォーム.エンコーディング) { jQuery(form).attr('エンコーディング', 'multipart/form-data'); } それ以外 { jQuery(form).attr('enctype', 'multipart/form-data'); } jQuery(form).submit();

} キャッチ(e) { jQuery.handleError(s, xml, null, e); } jQuery('#' + FrameId).load(uploadCallback ); return {abort: function () {}};

}、

UploadHttpData: function( r, type ) { var data = !type; データ = タイプ == "xml" ||データ ？ r.responseXML : r.responseText; // タイプが「script」の場合、グローバルコンテキストで評価します if ( type == "スクリプト" ) jQuery.globalEval( data ); // JSON が使用されている場合は、JavaScript オブジェクトを取得します。 if ( type == "json" ) eval( "データ = " + データ ); // html内のスクリプトを評価します if ( type == "html" ) jQuery("

").html(data).evalScripts(); データを返す; } })

id="file1" size="30" /> onclick="return ajaxFileUpload();" /> style="display: none">アップロード中...

up_deal.php

代码如下 复制幣 if ((($_FILES["file1"]["type"] == "画像/gif") || ($_FILES["file1"]["type"] == "画像/jpeg") || ($_FILES["file1"]["type"] == "画像/bmp") || ($_FILES["file1"]["type"] == "image/pjpeg")) && ($_FILES["file1"]["size"] $extend =explode(".",$_FILES["file1"]["name"]); $key = count($extend)-1; $ext = ".".$extend[$key]; $newfile = time().$ext;

if(!file_exists('upload')){mkdir('upload');} move_uploaded_file($_FILES["file1"]["tmp_name"],"upload/" . $newfile); @unlink($_FILES['file1']); エコー $newfile; }その他{ エコー「エラー」; } ?>

http://www.bkjia.com/PHPjc/632906.html www.bkjia.com true http://www.bkjia.com/PHPjc/632906.html 技術記事 jquery ajax を利用して php を使用して図を上に転送し、下で私を介して php ajax を利用してさまざまなファイルを新規に上に転送し、サンプルを直接公開することで各位の同学に役立つことを希望します。

PHP Ajax アップロード ファイルの例 [ajaxfileupload.js]_PHP チュートリアル

PHP Ajax アップロードファイルの例 [ajaxfileupload.js]_PHP チュートリアル