（原）
公司項目要換框架，然后丟了一套國外的給我，ace admin，本想著(zhù)拿來(lái)改改，翻翻百度就能用的，可它是國外的啊，國內普及率又不高，沒(méi)辦法，硬著(zhù)頭皮一點(diǎn)點(diǎn)啃英文文檔吧。
最近留郵箱要文檔的太多拉，為了方便你我他，給個(gè)地址你們下面，需要5個(gè)CSDN的積分哦，如果頁(yè)面進(jìn)不去，表示還在審核中，請等待一段時(shí)間再試，謝謝！
簡(jiǎn)介：ACE是一個(gè)功能豐富易于使用的輕量級模板，當前包含的功能有：
4套皮膚、基于bootstrap 3.3.5版本的相應式布局、js和css的功能構建、一套發(fā)送郵件的布局、自定義元素的插件以及jquery ui,bootstrap 的部分插件。
所有的html文件放在了html目錄下，如果開(kāi)發(fā)人員需要更改這些，可以從一個(gè)簡(jiǎn)單的頁(yè)面開(kāi)始，頁(yè)面放在了：html/empty.html中。
（以上為頁(yè)面結構）
胡子文件夾，說(shuō)明中第一句中寫(xiě)的：你不需要在你的應運中使用到它。它實(shí)際上是存的給Demo演示用到的json文件及文檔中需要的信息描述文件。
css樣式，在第8條里面，它提供了一個(gè)css builder （樣式生成器），可以根據項目需要的功能點(diǎn)的樣式，它可以單獨的導出。
對于bootstrap樣式，這里他們做了一些改動(dòng)，如把bootstrap中的槽寬，由30px改成了24px等一些其它的改動(dòng)。
引入樣式文件的順序
關(guān)于ace文件。這里的與ace有關(guān)的js文件都被封裝成各種js插件，ace.js包含主函數，如側邊欄，小部件等。
注意：bootstrap.css被輕量的修改過(guò)，不要使用CDN上的該文件或是官網(wǎng)及其它地方引入的該文件
最后，你需要所有插件引入完以后加上,ace-element.min.js和ace.min.js這二個(gè)js文件（引入JS的順序）,js 的文檔的第四部分講的是js文件引入的順序。
頁(yè)面布局部分，這里講了demo的頁(yè)的設計結構以及每部分需要引入的樣式
導航部分介紹了布局，樣式的引用，品牌、標題按鈕以響應式布局的演示(這部分寫(xiě)的很詳細)。
側邊欄同樣的介紹了布局、菜單列表、快捷鍵、最小化按鈕、側邊欄功能，響應式側邊框以及ajax和非ajax布局。
主內容布分介紹了頁(yè)面布局、路徑導航（也叫面包屑導航屑）、查詢(xún)框、頁(yè)面標題、主內容區域以及頁(yè)面的設置區域
（上圖為踩過(guò)的坑）
在一些ajax頁(yè)面中，有些頁(yè)面沒(méi)有包含橫向菜單和jquery UI渲染的頁(yè)面。
這是因為橫向菜單是基于改變well的(well是bootstrap中一個(gè)樣式)
在加載完jQuery UI庫以后，其中的提示控件(tooltip)和日歷控件(datepicker)會(huì )覆蓋bootstrap的樣式，在你使用jquery UI或是bootstrap 的日歷時(shí)這都不是問(wèn)題，但是請不要在使用以上控制時(shí)同時(shí)使用jquery ui庫和bootstrap庫。
后面一塊黑色區域代碼很重要，文檔上意思是，你只有調用了如下ace_ajax方法，你才能使用ajax加載。
畫(huà)紅框的地方非常重要，雖然順著(zhù)文檔看時(shí)，可能看不明白什么問(wèn)題，但是把問(wèn)題解決以后再來(lái)看這里，這里其實(shí)是一個(gè)大坑，文檔上說(shuō)，在ace demo中，有一個(gè)樣式為.page-content-area及以有一個(gè)屬性為data-ajax-content="true"的元素，這個(gè)元素中間的部分是可用ajax更新的，因為在默認的ace中下面的代碼是可用的。
在html/ajax/ajax.html下，有一個(gè)空白的ajax頁(yè)面，它可以方便開(kāi)發(fā)人員以他的頁(yè)面格式開(kāi)發(fā)自己的的content頁(yè)面。(文檔中這樣描述)。
而實(shí)際上，它的文檔中并沒(méi)有這個(gè)文件，不過(guò)html/ajax下有一個(gè)blank.html文件，該文件是個(gè)空文件，你可以以這個(gè)文件為模板進(jìn)行開(kāi)發(fā)，（這里應該是描述地址的一個(gè)錯誤）。
setting up 設置部分說(shuō)了，你能找到一個(gè)樣式為.page-content-area及以有一個(gè)屬性為data-ajax-content="true"的元素，如上圖。
順便說(shuō)一下，你需要改變上面設置參數中的content_url部分，或者你重新初始化一個(gè)屬于你自己的ace_ajax方法。
第三部分講的是ace_ajax方法的參數，其中最重要的就是一個(gè)就是content_url,它是一個(gè)帶返回url值的函數，文檔這里藍色部分說(shuō)的是，請注意，如果你的ajax 加載的內容部分是遞歸的，你需要一個(gè)合適的函數基于函數值返回一個(gè)有效的url值。
（這里就是ajax開(kāi)頭部分踩到的坑，直接在空白頁(yè)面無(wú)論怎么配置文檔里提供的ace_ajax方法，結果都一樣，永遠是一個(gè)首頁(yè)無(wú)限遞歸。）
當時(shí)想到這個(gè)問(wèn)題的原因是，一定會(huì )有一個(gè)地方設置它的跳轉，90%可能是在它的相關(guān)插件的源碼里
在它的源碼中，ace_ajax首先是做了參數的處理，然后初始化了一個(gè)AceAjax對象，并把參數傳了進(jìn)去。
在A(yíng)ceAjax方法中，僅是對content_url進(jìn)行了傳值，包括以后的部分也都是在對傳入的這個(gè)url值做處理， 中也沒(méi)有page/index 這個(gè)參數值，因為首頁(yè)無(wú)限加載首頁(yè)，那么一定是遞歸了page/index頁(yè)面（至少會(huì )有index關(guān)鍵字），因為在加入了ajax content以后，再次訪(fǎng)問(wèn)頁(yè)面時(shí)，地址欄會(huì )自動(dòng)帶了#page/index。
最后全局搜索關(guān)鍵在，在ace.js中找到了page/index，被定義在了demo_ajax_option變量里。
接著(zhù)用$('[data-ajax-content=true]').ace_ajax(demo_ajax_options)調用了ace_ajax方法，上面還有一段注釋?zhuān)f(shuō)的是初始化那個(gè)在demo頁(yè)面中有著(zhù)page-content-area[data-ajax-content=true]屬性的元素。
也就是說(shuō)這個(gè)代碼針對于他的demo演示頁(yè)面做的跳轉，而你在使用它的demo，僅是在頁(yè)面級做修改，他的ajax跳轉主頁(yè)永遠會(huì )是index頁(yè)面。
在上面，它的文檔里提到了，說(shuō)在ace里有如下代碼做ajax內容區的跳轉，但是沒(méi)有沒(méi)有指明是具體的哪個(gè)文件（這里應該是ace.js文件），并且關(guān)鍵參數區域被省略掉了（紅框部分），而實(shí)際上它是在ace.js的行這么寫(xiě)的：
這一塊屬于文檔描述關(guān)鍵點(diǎn)的缺失，解決這個(gè)問(wèn)題有2個(gè)簡(jiǎn)單的方法，
1、將ace.js中的ace_ajax方法的參數按自己實(shí)際項目需求重新修改。
2、將執行ace_ajax方法的這段代碼注釋掉，然后在自己的框架中控制這個(gè)代碼的執行。
聯(lián)系客服
