2 11,460
【HTML5開發友善網頁介面】 已採用HTML5的實例: T客邦(語意標籤)、永豐銀行信用卡網站、LEXUS活動網站(canvas)、NVESTO股票線圖(canvas)、HITCON駭客年會官網(Responsive Web Design, RWD)、Fandora.tw(RWD) ...

0 10,061
【Windows to Go】 精準定義: 將Windows 8企業版安裝在認證過的隨身碟上帶著到處走 應用情境: 方便攜帶，不帶NB也能在其他地方使用"自己的作業系統" (比帶NB輕巧，但個人以為此點說服力較弱) 臨時性人員 / ...

4 11,785
微軟年度盛會TechDays 2012又來了! 身為靠微軟技術討生活的中年大叔，跟著進香團帶筆電過個香爐參與課程認真做筆記，也是佷合情合理的。所以，TechDays 2012隨堂筆記來囉~~ 【Keynote】 看到尚未上市的Intel Ultrabook雛型機展示，Keyboard ...

4 8,196
依我個人觀點，hasfocus繫結的實用性較低，但應該還是有適用的場合。簡單地說，它可以將Boolean屬性繫結到可取得輸入焦點的HTML元素上(例如: TextBox、CheckBox、RadioButton、Select、Button...)形成雙向繫結，當元素取得焦點時，ViewModel...

0 11,439
針對checkbox, radio等HTML元素，knockout.js提供了checked繫結。有三種應用方式: 配合多個radio，使用相同的name形成多選一，每個radio有不同的value，KO會將被點選radio的value設成到指定的ViewModel屬性上；而當ViewM...

0 15,726
從Windows NT以來，檔案系統開始支援存取權限設定，但這個技巧今天才學會。 在Windows裡將資料夾複製到另一個位置時，複製後的目錄及檔案預設會套用新位置的權限設定。今天想把網站搬到其他磁碟機，卻發現網站部分目錄被賦與IIS虛擬帳號寫入權限，複製過去後寫入權限設定遺失，導致網站無法...

1 8,074
knockout.js也支援繫結到網頁元素的事件，例如: keypress、click、mouseover、mouseout... 等都沒問題。但如果純粹要在特定事件加入程式邏輯，大可使用jQuery來做，突顯不出KO的強悍。依我個人看法，KO的事件繫結真正犀利之處在於搭配foreach、wit...

2 10,555
假想以下情境，ViewModel有個players屬性，為一ko.observableArray，其中的元素為player，具有name及bestRecord兩個屬性，其中bestRecord預期會再包含date及score屬性。 在網頁上，打算用foreach將每個player以<li...

0 10,674
範例7很簡單，示範如何透過屬性控制HTML元素顯示與否(visible)、可以操作與否(disable)，以及依屬性決定是否加上特定CSS class。 線上展示 最前方的Checkbox，勾選後TextBox會設為disabled，後方會出現一個內含"完成!"文字的&...

10 12,116
範例4已展示KO完全掌握observableArray()陣列元素增減，即時反應在UI的能力。但如果我們希望在陣列增加或移除元素時加上自訂邏輯，要怎麼做? foreach提供了afterAdd及beforeRemove兩個額外的事件繫結設定，允許在陣列新增、移除元素時執行特定邏輯。在此繼續沿用先...

0 10,559
在範例4使用了totalScore ko.computed函數即時加總全部使用者的積分，經實實測，新增或移除資料時積分總和會立即改變。如果是修改某一筆使用者績分呢? $("#btnChgScore").click(function () {  &...

8 18,449
接著來看如何用KO處理超級基本的網頁設計議題--以清單方式呈現資料。 想處理以陣列形式儲存的多筆資料，要先認識foreach。在ViewModel定義一個JavaScript Array或是ko.observableArray() (observableArray在新增或剔除陣列元素時，KO會...

2 22,775
在範例2中提到<select> data-bind的options選項若繫結到ko.observableArray()，可實現動態新增選項效果，範例3就來測試這項特性。 ViewModel中宣告一個selectOptions屬性，為一ko.observableArray()物件...

2 27,680
下拉選單<select>也是網頁設計重要的一環，knockout.js(以下簡稱KO)也有不錯的支援。針對<select>，在data-bind除了用value可對應下拉選單的選取結果，其選項也可以由ViewModel中取得，甚至動態改變。以下是<select>...

0 20,730
knockout.js是一套令人驚豔的JavaScript MVVM程式庫，透過MVVM的運作原理，開發程式時只需專注於定義ViewModel邏輯，不需耗費心力處理TextBox、Select的onchange、onclick等互動細節，就能實現UI元素與資料天人合一的境界。身為網頁開發老鳥，雖...