如何封裝JS和CSS檔案為伺服器端控制項

我們以封裝乙個js的日期控制項為列子，將它和伺服器的textbox結合在一起做成乙個伺服器控制項，以達到直接託上去就可以使用的效果。其實很簡單，大家共同學習。先看看效果圖：

方法：

然後：建乙個日期類檔案calendarbox.cs**如下：

using system;

using system.collections.generic;

using system.componentmodel;

using system.text;

using system.web;

using system.drawing;

using system.web.ui;

using system.web.ui.webcontrols;

using system.web.ui.htmlcontrols;

namespace wisesoft.web.control

void page_prerendercomplete(object sender, eventargs e)

/** 〈summary〉

/// 〈/summary〉

[bindable(true)]

[category("圖示設定")]

[defaultvalue("imagin/calender.gif")]

[localizable(true)]

public string imaginurl

set }

/** 〈summary〉

/// 設定日期，時間的初始格式。

/// 〈/summary〉

[bindable(true)]

[category("初始化設定")]

[defaultvalue(false)]

[localizable(true)]

public bool showtime

return false;

} set }

/** 〈summary〉

/// 注樣式檔案

/// 〈/summary〉

/// 〈param name="path"〉〈/param〉

private void registercssfile(string path) }

} 再看 void page_prerendercomplete(object sender, eventargs e)

是在頁面呈現之前將你的js檔案註冊到頁面上。

[bindable(true)]

[category("圖示設定")]

[defaultvalue("imagin/calender.gif")]

[localizable(true)]

是利用反射的元資料資訊，來設定屬性。就是給你的日期控制項旁邊加上個小圖示，把它做成乙個屬性，可以讓程式設計師自定義設定，也可以把它繼承進去。

好了，這樣就可以把js檔案封裝好了，再來看看css檔案如何封裝並寫入客戶端。

我們可以看見下面有乙個方法，

/** 〈summary〉

/// 注樣式檔案

/// 〈/summary〉

/// 〈param name="path"〉〈/param〉

private void registercssfile(string path)

它就是用來註冊你的css檔案的，大家都知道在我們的頁面**裡面是〈link href="stylesheet.css" rel="stylesheet" type="text/css" /〉引入外部樣式檔案。這個方法就是達到這個目的。那麼我們現在還沒有樣式檔案。

因此我們就必須建立乙個css，然後把它設定一下（和js的設定方式一樣）。再到void page_prerendercomplete(object sender, eventargs e)方法呼叫就可以了，但是還有其他方法，我們來介紹第二種（對js檔案也可以這樣使用），建立乙個calendarcss.cs檔案，**如下：

using system;

using system.collections.generic;

using system.text;

namespace wisesoft.web.control

.wdatefmterr

〈/style〉";

} }這個類其實是將我們的css檔案，寫為乙個字串形式，然後供主函式呼叫，以註冊到客戶端使用。

那麼我們再看看calendarbox.cs檔案裡的這段**

string calendar = calendercss.css;

calendar = calendar.replace("$imaginurl$", this.imaginurl);

if (!page.clientscript.isclientscriptblockregistered("_calendar"))

page.clientscript.registerclientscriptblock(typeof(string), "_calendar", calendar);

它就是將我們已經寫好的一段字串以快的形式註冊到客戶端（當然還有更多的註冊方式，可以在msdn看看clientscript類）。

**酷網動力(www.aspcool.com)。

如何封裝JS和CSS檔案為伺服器端控制項

如何封裝JS和CSS檔案為伺服器端控制項

新增css和js檔案

CSS檔案和JS檔案組織

如何封裝JS和CSS檔案為伺服器端控制項

如何封裝JS和CSS檔案為伺服器端控制項

新增css和js檔案

CSS檔案和JS檔案組織

相關推薦