EonerCMS 做乙個仿桌面系統的CMS(五)

2022-02-09 09:19:19 字數 1538 閱讀 6863

這次主要講一下js模板和滑鼠右鍵功能,東西比較簡單,我就沒有做demo,簡單說下原理吧。

js模板

為什麼要使用js模板?因為在這個系統裡,我經常要開啟乙個或多個視窗,但實際上這些視窗的html**都是一樣的,只是其中的引數稍微有點變化。既然如此,何不寫成模板,把引數定義成指定格式的標籤,然後用正則批量替換,生成真正的html**,再插入頁面中。這樣不僅閱讀方便,而且修改也方面。

說改就改,改之前我考慮了另乙個問題,就是要不要使用網上現有的js模板引擎,這方面因為之前完全沒了解過,所以搜了幾個,有的似乎很有名,比如jst,但也非常大,所以我沒有考慮;有的很小,也就是一些jser自己寫的外掛程式,我擔心會有bug,所以也沒考慮。最終我打算自己寫,因為我不需要ajax--json--dom這麼乙個流程,所以,我就找了乙個替換模板引數的方法,雖然不是我寫的,但是很好用,來看一下吧:

var formatmodel = function(str,model)","g");

str = str.replace(re,model[k]);

} return str;

}

要怎麼用呢,其實很簡單,看下for迴圈裡面的操作就清楚了,str是傳入的模板,model是個key--value陣列,看下具體用法吧:

//圖示模板

var shortcuttemp = '

';_cache.shortcuttemp = ;

shortcuttemp是圖示模板,其中需要替換引數的書寫格式是,_cache.shortcuttem就是那個引數陣列了,這個方法我建議大家可以收藏一下,挺好用的。最終替換後輸出就是這個樣子了:

小睿的部落格

下面說下滑鼠右鍵,這個功能其實是必不可少的。可能大部分人知道網頁上點選滑鼠右鍵都是彈出瀏覽器設定的工具條,所以一般沒人會點。但是我記得之前看到過一句話,就是「乙個好的產品,就是能讓使用者在使用的過程中,突然說出:『我靠,居然還有這功能』。那麼,這個產品就成功了」,所以,關於右鍵,這個功能必不可少,哪怕就一兩個地方能用上。

滑鼠右鍵

這快沒有太大難點,簡單給段**自己去嘗試下吧:

//繫結工作列點選事件

$('.task-window li').live('contextmenu',function(e));

右鍵點選我

因為是在iframe裡呼叫,所以要在呼叫方法前加上「window.parent」,也就是這樣:

window.parent.zeng.msgbox.show("設定成功!", 4, 2000);
ok,內容說完了,今天是國慶,所以祝大家國慶快樂,玩的開心。像我這種沒什麼活動,工作能力又不是很強的,只能趁大家都休息的時候偷偷學學,努力趕超,想必應該也有一群和我一樣處境的人吧,相信總有一天我們的能力會得到大部分人認可的。

不說了,忙了一晚上,也該休息下了,打dota去了

EonerCMS 做乙個仿桌面系統的CMS(四)

按住我拖動 一晃又過去乙個多星期了,途 了個差,進度上略有耽誤,不過還好,上次有個話題沒說完,這次繼續,就是視窗拖動以及改變視窗尺寸。視窗拖動 改變視窗尺寸 html 如下 按住我拖動 ready function titledemo bind mousedown function e docume...

EonerCMS 做乙個仿桌面系統的CMS(二)

上一周我說到,我要開始做乙個仿桌面系統的cms。現在,一周過去了,來做個小小的總結吧,順便把上一周片尾留的小問題解答下。桌面 關於介面,思前想後,還是模仿115的了,說是模仿,其實幾乎是照搬。因為我看了下html和css,沒有什麼太大的技術含量,製作起來也不會遇到什麼困難,乾脆捨棄這一步,進入後面的...

EonerCMS 做乙個仿桌面系統的CMS(七)

智慧型修改視窗的位置 在測試的時候,我發現調整瀏覽器尺寸後,原先靠近瀏覽器邊緣的視窗就直接被隱藏掉了,如下圖 出現這問題的原因也很簡單,因為視窗的top left的值是寫死的,當瀏覽器的寬高小於視窗top left時,必然會被隱藏掉。解決辦法就是在調整瀏覽器尺寸的同時,把視窗的top left也一起...