在製作專案的過程中,為了給登入使用者提醒功能,需要將當前的提示資訊字型顏色變換幾次,以達到引起使用者注意的目的.具體做法就是當滑鼠移動過提醒資訊的時候,當前的字型顏色能夠每隔50ms變換一次.
非plugin版本的製作方法
初次接觸到這個需求的時候,很多人都想到利用settimeout來做,我也不例外,**如下:
由於在**中注釋的已經很詳細了,這裡我就不再多加解釋了,核心思想就是利用settimeout方法遞迴呼叫函式體本身,以達到迴圈變換的效果.
然後問題出來了,當**很多地方需要這種效果的時候,單純的貼上賦值顯得過於笨重了,所以這裡準備依據上面的**邏輯,來實現乙個jquery字型外掛程式.
plugin版本的製作方法
開始之前,需要說明的是,當新寫乙個jquery外掛程式的時候,一般都是以$.fn.mypluginfunctionname來定義呼叫的函式的名稱,這裡我們也不例外:
之後的使用方法就很簡單了 ,直接把之前的**搬過來即可.具體方法如下:
首先,我們先把之前的changefontcolor核心函式搬過來:
然後,在主函式體中繫結剛才寫的changefontcolor函式:
這樣乙個很簡單的jquery plugin就編寫好了. 將其儲存為fontdaemon.js,然後在頁面中引用,直接利用如下的**,即可成功呼叫:
下面是具體的使用結果展示:
當然,如果能夠將當前的元素返回,那麼我們是可以繼續改變其屬性的,也就是說,雖然我們呼叫$(".test").fontdaemon();,但是我們依然可以改變.test類的屬性: $(".test").fontdaemon().css("background","green");
這個改如何實現呢?其實很簡單,只需要將當前元素return即可:
最後顯示的結果如下:
更新一下
然後你可以按照下面的三種方式來使用:
參考資料
from codeproject:
stackoverlow 問答:
如何去寫乙個jquery外掛程式
前些日子，因為專案的需求，自己定製了一款jquery彈窗，這得益於自己之前接觸的專案讓我對於物件導向程式設計有了深刻的理解。在jquery的基礎上拓展一款彈窗外掛程式 jquery原始碼中可知，jquery.fn便是jquery的命名空間。jquery.fn jquery.prototype var...
如何寫乙個jquery外掛程式
本文總結整理一下如何寫乙個jquery外掛程式？雖然現今各種mvvm框架異常火爆，但是jquery這個陪伴我們成長，給我們帶來很多幫助的優秀的庫不應該被我們拋棄，寫此文章，作為對以往欠下的筆記的補充，以及對jquery的重溫。寫jquery外掛程式有三種方法 1.使用 extend 來拓展jquer...
如何寫乙個jQuery外掛程式
jquery 的外掛程式開發模式主要有三種 這裡我們選用第二種 fn.myplugin functin 因為這種方法是加在jquery物件上，可以在jquery選擇器選擇元素後直接呼叫 body myplugin 若對其他兩種方法有興趣，請自行檢視jquery 官方文件。改變元素的背景顏色外掛程式 ...