Category: knockoutjs

就用這篇鬼故事當開場吧!在 2016 年学 JavaScript 是一种什么样的体验? 這幾年 HTML5 火紅,前端開發技術發展如黃河氾濫一發不可收拾,開發框架百家齊嗚,眼花瞭亂不知如何下手就算了,更要命的是市場主流每兩年就轉一次風向,兩年前我才含淚從 Knockout 轉到 Angular...

KO 3.2版除了美妙的HTML自訂元素,還有一項小革新 - pureComputed。 依據官方文件,pureComputed 的 pure 借用自 Pure Function,其主要設計理念在於: 計算 computed observable 時不應產生任何副作用。 com...

先看展示: 這是一個很簡單的 MVVM 繫結示範,模擬網頁常見「給幾顆星」的評分機制。上方透過 click 事件修改observable,同時繫結到下拉選單及Score=文字顯示。同一 observable 繫結到兩個 UI 元素的情境對KO來說是小菜一碟,不足掛齒,但 HTML 裡有玄機:...

市長候選人柯P的競選團隊前幾天做了一件有趣的事(只有程式魔人覺得有趣),突發奇想地將官網內容透過Web API方式提供,歡迎開發人員自行開發野生官網。昨天,保哥瞬間變出AngularJS版,好不神奇! 依我的理解,這個需求還算簡單,應該也難不倒knockout.js,而更重要的是,這年頭大家都去...

照片出處: http://www.geograph.org.uk/photo/360000 作者: Barbara Voules 兩年前初見Knockout.js後便一腳踏入MVVM世界無法回頭。學習簡單很快上手,用Knockout做出錯誤少又容易擴充維護的AJAX網頁。在此之前,為了讓欄...

專案裡的介面需求: 網站需開放使用者由候選清單挑選多個項目放入組成清單,組成清單的項目要能調整順序。 實作範例如下,就想像從三國武將中挑選精英組團打副本吧!(裡面有個黑大是什麼東西?) 並可調整出場順序。 搬出Knockout,運用下拉選單的options、selectedOptions...

【前情提要】利用File API與XHR2 onprogress事件,我們成功做出檔案上傳進度條。但我在工作上常遇到另一種情境 -- 內部系統的上傳轉檔作業。營運資料檔案一般不大,加上在Intranet裡傳輸,上傳只在彈指間,Server端解析資料、塞入資料庫才是重頭戲,常得耗上幾十秒到幾分鐘。...

在傳統網頁上傳大檔案,得等到全部傳完才會有回應,等待期間沒消沒息,搞不清楚是沒傳完還是當掉常為人詬病,也嚴重破壞使用者體驗。想在傳輸過程回報上傳進度,過去有些Flash、Java Applet或ActiveX的解決方案,但依賴外掛元件有部署及無法跨平台的疑慮。當HTML5規格漸成主流,長久以來的...

這年頭,網頁如果不支援從桌面或檔案總管直接拖拉檔案,想自稱HTML5都心虛,只能稱作HTML4.5(誤),老闆客戶還會不時打你臉: "Gmail、OneDrive(SkyDrive)、DropBox幾百年前就有了! 為什麼你到現在還做不出來?" (網頁攻城獅內心的OS: ...

現在的跑者愈來愈幸福,每逄賽事總能見到馬拉松世界、運動筆記所出動或熱心自發的攝影大人,揹著沈重攝影器材,不畏日曬雨淋地在賽道旁補捉跑友身影,賽後再上傳至網站供跑友自取留念。(在此特向辛苦的攝影大哥大姐們致敬) 不過一場比賽常有成千上萬張照片,要在茫茫照片大海找尋自己的英姿有點小挑戰。照片雖然都...

最近在400米跑道練配速及間歇,開始在意每圈的配速精準度。消費型GPS裝置誤差大於10公尺,但測試數據時而偏東時而偏西,累計下來截長補短,倒也不致偏差里程太遠。依經驗,GH-625M一圈400米平均有10-15米誤差,訊號不佳時甚至多到50米;Bryton Cardio 40H的心率頗準,但GP...

Knockout.js在去年10/25釋出3.0版,手上專案總算由焦頭爛額推進到火燒屁股(好像沒有比較好耶 XD ),便開始著手進行一些零散重構,也順便升級第三方程式庫(有個IE11問題要靠KendoUI升級解決),Knockout.js也想一併升級成3.0。整理Knockout.js 3.0資...

專案出現一個ko.computed()應用實例,剛好可以考驗開發者對ko.computed()了解是否透徹。各位同學,準備接招! 需求是這樣的,有A、B、C三個欄位,若使用者修改A或B,C需更新為A + "-" +B;若使用者直接修改C,則以其輸入字串為主,忽略前述由A/B...

專案需求一枚,用於匯率換算。來源幣別及目標幣別以下拉選單方式顯示,想當然爾,目標幣別跟來源幣別相同還轉換個屁,因此規格提到: 目標幣別的下拉選項應包含所有幣別,但排除來源幣別當下的選取幣別,特殊的下拉選單連動需求應運而生。 要用KO實現此一連動並不困難: 為兩個<SELECT>各宣...

在IE9遇到一個問題: 透過Knockout text繫結變更SPAN內容,IE9無法立即顯示更新結果,但開啟IE Dev Tools要開始偵查時才回神連忙顯示。切到IE8/7相容模式時不會發生,在其他版本IE(IE10、IE8)或Chrome、Firefox也不曾遇過,推測是IE9渲染(Ren...