extjs簡介_動力節(jié)點Java學院整理
ExtJS為開發(fā)者在開發(fā)富客戶的B/S應用中提供豐富的UI組件,具有統(tǒng)一的主題,便于快速開發(fā),提高效率。但顯然它并不適合互聯網站的開發(fā)。
主要目錄文件介紹
- builds:壓縮后的ExtJS代碼,體積更小,更快;
- docs:開發(fā)文檔;
- examples:官方演示示例;
- locale:多國語言資源文件;
- pkgs:ExtJS各部分功能的打包文件;
- resource:ExtJS所需要的CSS與圖片文件;
- src:未壓縮的源代碼目錄;
- bootstarp.js:ExtJS庫引導文件,可自動切換ext-all.js與ext-all-debug.js;
- ext-all.js:ExtJS核心庫;
- ext-all-debug.js:ExtJS核心庫的調試版,調試時使用。
- ext-all-debug-w-comments.js:帶注釋的ExtJS核心庫調試版。
如何引入文件
在項目中使用ExtJS,以下文件必需的:
1 整個resources文件夾
2 ext-all.js或ext-all-debug.js或ext-all-debug-w-comments.js文件
3 ext-lang-zh_CN.js文件
在頁面中用到ExtJS至少引入以下文件:
1 resources\css\ext-all.css
2 ext-all.js(如果要對ExtJS代碼進行調試或學習可引入ext-all-debug.js或ext-all-debug-w-comments.js)
3 ext-lang-zh_CN.js
一個簡單示例
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>ExtJs</title> <link href="ExtJs/resources/css/ext-all.css" rel="external nofollow" rel="stylesheet" type="text/css" /> <script src="ExtJs/ext-all-debug-w-comments.js" type="text/javascript"></script> <!-- <script src="ExtJs/ext-all.js" type="text/javascript"></script> --> <script src="ExtJs/ext-lang-zh_CN.js" type="text/javascript"></script> <script type="text/javascript"> Ext.onReady(function () { //創(chuàng)建一個窗體 var win = new Ext.Window({ width: 300, height:300, items: [], modal: true, buttonAlign: 'center', buttons: [{ text: '測試', id: 'btnTest', handler: function () { Ext.Msg.show({ title: '詢問', msg: '您喜歡 ExtJs 嗎?', fn: processResult, icon: Ext.Msg.QUESTION, buttons: Ext.Msg.YESNO }); } } ] }); win.show(); }); //詢問對話框處理Handler function processResult(btn) { Ext.Msg.alert('結果', btn); } </script> </head> <body> <div> </div> </body> </html>
相關文章
js與jquery實時監(jiān)聽輸入框值的oninput與onpropertychange方法
這篇文章主要介紹了js與jquery實時監(jiān)聽輸入框值的oninput與onpropertychange方法,實例分析了oninput與onpropertychange實現下拉框里自動匹配關鍵字實時監(jiān)聽文本框value值變化的功能,需要的朋友可以參考下2015-02-02三劍客:offset、client和scroll還傻傻分不清?
這篇文章主要給大家介紹了三劍客:offset,client和scroll的相關資料,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2020-12-12