ExtJSライブラリは、オンデマンドで自動的にロードされます。

今日は、オンデマンドでライブラリを動的にプリロードする機能について説明します。 最初に、フレームワークを使用するには、最初にページ上のスタイルファイルを接続し、次にメイン機能を実装するアダプターを接続する必要があります。別のAJAXライブラリをベースとして使用する場合は、最初にその配布を行います。 そして、メインExtJSファイル、または開発段階でのそのデバッグバージョンのみ。 もちろん、すべてのファイルを1つにまとめると、gzip圧縮などの手法がダウンロード時間の短縮に役立ちます。 しかし...



しかし、タスクが十分に狭い場合、たとえば、一部のWebサイトがExtJSを使用して資料を追加および編集するためのフォームを提供しているときに出くわしました。 同時に、すべてのユーザーが常にそれを使用するわけではないという意味で、編集プロセスは非常にまれです。さらに、非登録モードでサイトを操作することは、編集機能がない場合のみ異なります。 すべてのファイルを一度にダウンロードします。これは約600 Kbです。慎重に組み立てられたバージョンがプロジェクトのニーズを考慮して特別に設計されている場合でも、これは非常に高価であり、すべてのユーザーにアップロードしたくありません。



次の写真が判明しました。 登録なしでボットなどを検索するすべての訪問者には、それぞれ編集機能を使用しない標準ページがロードされますが、これらのファイルは接続されていません。 その結果、表示とインデックス作成に適した軽量のページができました。



登録ユーザーの場合、写真はわずかに変わります。 彼はすでに情報編集ツールを利用可能にする必要がありますが、それらを使用しない可能性が高いため、この段階ではExtJSライブラリ全体をダウンロードしません。 そして、次のことを行います。



最初に、ExtJSディストリビューションのスタイルファイルがページに追加されます。 スクリプトから、jQueryと特別なアダプターを使用してライブラリアセンブリを使用します。 これら2つのファイルを結合して、jQueryの最初の縮小バージョンを作成し、次にExt-jquery-adapterを作成します。 そして、このスクリプトはページにアップロードされます。 ExtJS CSSの圧縮バージョンは約40 KB(特にプロジェクトのニーズに合わせて調整されている場合)を必要とし、必要なライブラリを組み合わせた縮小スクリプトは73 KBであり、これはまだgzip圧縮機能を考慮していません。



その結果、まずページにアクセスします。まず、jQueryの主な機能、そして最も重要なことはExtJSの最も最小のコア、文字通りExtルートクラスの主な機能と機能、および標準JavaScriptオブジェクト(たとえば、String、Array、 ExtJSを使用する日付は「ボーナス」を取得します)。



ライブラリコードを見ると、メインファイルext-all.jsには他のすべてのコンポーネントが含まれていることがわかりますが、既にロードされているExtクラスは拡張されています。 そしてこれは、ページ全体をロードした後いつでもロードできることを意味し、ブラウザによる実行後、必要なすべての機能をオンザフライで取得します。 必要な主なものは、プリロードされたアダプターとスクリプトの初期化された基盤です。



そして、ライブラリをロードしましょう。 ExtJSの関数はまだ使用できないため、jQueryの機能を使用して初期化します。つまり、データ処理が成功した後に、任意のJSコードをページにロードし、転送されたCallback関数を実行する組み込み機能を使用します。 jqueryの以前のバージョンでは、現在のドメインからしかダウンロードできませんでしたが、現在はクロスドメインダウンロードが許可されています。



さらに、完全なライブラリがロードされたのか、コアのみがロードされたのかをアプリケーションに通知するフラグ変数を作成する必要があります-ExtJSを使用すると、ライブラリがロードされているため、これを見つけるのは困難ですが、すべての主要な機能はまだ利用できません したがって、ライブラリの状態に関する情報を保存するためのグローバルフラグ変数を作成します。



ところで、たとえば、組み込みのガベージコレクターなどのオプションを設定するなど、Extをすぐに構成できます。たとえば、BLANK_IMAGE_URL定数のパスなど、これらのカーネル機能は初期化後すぐに使用できます。 Cookieマネージャーの初期化など、追加の設定が必要な場合は、これらすべてを別の関数に入れておくことをお勧めします。関数は読み込み後に自動的に呼び出されます。



そして今、エンディング、これは非常に簡単です。 _loadExtJS_andRun関数は、ライブラリのロード後に実行する必要があるコールバック関数という単一のパラメーターを受け入れます。 まず、フラグを確認します-ExtJSが既にロードされている場合、すべてのアクションをスキップして、すぐにコールバックを呼び出します。 そうでない場合は、jQueryのローダーを使用します。これは、正常にロードされた後、最初に初期化関数を呼び出します(例では、State Managerを初期化して、CookieとQuikTipをコードで直接処理しますが、関数として設計することをお勧めします)コールバック。



Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  1. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  2. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  3. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  4. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  5. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  6. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  7. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  8. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  9. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  10. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  11. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  12. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  13. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  14. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  15. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  16. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  17. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  18. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  19. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  20. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  21. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  22. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  23. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  24. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  25. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  26. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  27. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



  28. Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .



Ext.BLANK_IMAGE_URL = '/inc/extjs/resources/images/default/s.gif' ; Ext.enableGarbageCollector = true ; // _isLoadedExtJS = false ; function _loadExtJS_andRun(callback) { if (_isLoadedExtJS == false ) // { // JQuery $.getScript( '/inc/extjs/ext-all.js' , function (data, textStatus){ if (textStatus == 'success' ) { _isLoadedExtJS = true ; Ext.state.Manager.setProvider( new Ext.state.CookieProvider({ path: "/" , expires: new Date( new Date().getTime()+(1000*60*60*24*30)) })); Ext.QuickTips.init(); // callback(); } }); } else { callback(); } } * This source code was highlighted with Source Code Highlighter .







実際のアプリケーションでは、ユーザーにメッセージを表示するなど、何らかの理由でダウンロードが失敗した場合のオプションに対する反応でこのコードを補足することをお勧めします。



大きなライブラリの読み込みには時間がかかることがあるため、プリローダーを使用して、アプリケーションが何かを実行していることをユーザーに示すことをお勧めしますが、ExtJS機能を必要とする機能にアクセスするのは初めてです。



最も簡単なアプリケーションは、画像をクリックしてExt.Msg.alertダイアログボックスを表示することですが、わかりません。また、クリック処理機能はExtJSが利用可能かどうかを知りません(必要ありません)。 したがって、ハンドラーでは、ライブラリの可用性を個別にチェックするローダーのコールバック関数として指定し、すべての準備が整ったときにのみ関数の正しい初期化と実行を行います。







  1. style = "cursor:pointer;"
  2. onclick = "javascript:void _loadExtJS_andRun(function(){ Ext.Msg.alert( 'Alert'、 'Hello、World!');});"
  3. src = "inc / images / people.png"
  4. ボーダー= "0"
  5. alt = 「ブログのキャッチフレーズ」
*このソースコードは、 ソースコードハイライターで強調表示されました。



All Articles