16--在Rails中使用coffeescript

這節課講解前端腳本語言（之前學過的javascript）的使用方法，而且在微博應用中使用簡單的腳本語言進行簡單開發（指使用javascript給前端頁面添加動態效果）和測試。

咱們能夠直接在html頁面直接嵌入js語言，rails中也能夠這樣作。

咱們怎麼在上面的頁面中嵌入js呢？其實都一個套路，在最下面添加一個腳本語言的標籤叫script，類型寫javascript說明是使用的動態腳本語言是javascript。而後在裏面寫上要執行的代碼，好比咱們添加效果：點擊登錄按鈕彈出一個消息提示框顯示這個按鈕已經被點擊了。

點擊按鈕效果以下：

return false; <!--防止按鈕事件繼續傳遞，直接return false-->咱們點擊消息提示框的肯定那麼登錄事件不會被觸發，仍是停留在原來的登錄頁面，這個就是return false的做用終止事件繼續向下執行，因此表單不會被提交。

那麼問題來了，rails框架確定有更高級封裝的解決方案去進行前端開發，因此上面那種只是普通頁面進行的前端開發，rails有更高級的解決方案，以下javascripts文件夾裏面就是rails自動幫咱們生成的作前端開發的文件：

這個使用原理跟helpers相似，每個控制器或者說是資源，它具備一個對應的樣式文件如posts、sessis、users，很顯然你要對控制器中的哪一個視圖進行開發那麼你就將代碼寫到對應的文件裏就能夠。

咱們發現控制器對應的前端文件後綴不是js而是coffee，這個就是rails推薦使用的前端腳本語言coffeescript（說白了它就是一種更加簡潔的js語言），rails默認前端開發推薦使用coffeescript因此後綴就是coffee。

Coffeescript咱們要學習能夠去查看它的官方網站，有中文版的講解也很詳細。

咱們仍是以上面頁面將來，把以前普通方式添加javascript的代碼刪除掉，而後打開對應sessions的coffee文件：

以下文件告訴coffeescript的做用而且第3行告訴你了官方網站

而後咱們在coffee文件裏面寫上刪除的javascript代碼，可是語法稍微有點區別：

記住在寫以前必須在前面加上$ ->不然coffeescript腳本是沒辦法觸發的，這個記住便可。

還有跟javascript很大的區別就是縮進取代了{}

咱們添加完代碼後發現點擊沒有彈出消息提示框，懷疑還要去以下文件添加

沒看到代碼，展開+號就有了，添加第15行代碼以下：

把15行改爲就不報錯了，不過正常顯示登錄頁面仍是不能彈出消息提示框：

不過咱們仍是刪除添加的第15行代碼，問題並非出在這裏，問題多是windows系統使用rails出現各類意外的毛病，這個先無論。

還有咱們通常都打開兩個git控制檯，1個是運行rails server，另外一個執行安裝gem或其餘的命令。咱們要退出rails服務器就在運行rails server的那個git控制檯按下Ctrl+c這兩個按鈕就可（不是在另外一個Git控制檯按下，不然沒效果）

若是在另外一個git按下ctrl+c再重啓會提示以下，由於要在另外一個git控制檯按下ctrl+c纔對。

要是實在退不出，能夠刪除下面目錄的文件便可

還有要注意：不要輕易使用bundle update（因此安裝新的gem包以後不要執行該命令，重啓rails服務器就好，重啓rails服務器就是ctrl+c而後再rails server），不然不少gem包會被更新，那麼咱們之前作的更改可能發生變更，好比bcrypt的錯誤還會再次出現

 

就是用來包含咱們工程中須要的coffee文件

以下視頻中多了最後兩行，可是咱們的沒有，就算添加了不只沒效果反而會出錯，這個先無論，估計跟系統是windows有關。

如上require_tree .指的就是把自動生成的3個coffee文件都包含進去。

 

咱們若是使用第三方庫那麼就是把庫文件添加到工程的lib文件夾下，而後在如上application.js文件中包含這個庫文件，包含就是添加代碼//= require ***,***指的就是lib文件夾中添加的庫文件。