2022-05-16 10:13 PM 2 2,813
前陣子找到 JavaScript 快顯通知套件 - NOTY,雖然原作者已不再維護,但評估它最符合我的需求,如要修改也在我的能力範圍,維持原判。但接二連三有讀者提到,老朋友 SweetAlert2 其實就有定時自動關閉及其他快顯通知所需功能,有「眾裡尋他千百度,驀然回首,那人卻在燈火闌珊處」的驚喜感...
2022-05-14 07:55 AM 0 3,105
前幾天分享我找到好用的快顯通知套件 - NOTY,當時從一堆套件選中 NOTY,它只需一個 js 一個 css 搞定,甚至支援 IE10+,在 Github 上獲得超過 6700 顆星算是主流選擇之一,而簡便性與擴充性感覺不錯,最吸引我的點 - 不依賴 jQuery。雖然我一定會靠 jQuery 再...
2022-05-08 09:14 AM 5 4,399
當遇到狀況,網頁要顯示訊息的形式有很多種,最無腦最粗暴的做法是 alert(): 標題、位置、樣式沒得選,也談不上與網頁風格一致,但系統內建不必花腦筋,程式碼可中斷等使用者回應再繼續,用起來超簡單是它最大優點。 但如果你的網站要拿來換錢錢或分數,簡陋的 alert()/confirm() 很容易讓...
2022-05-06 09:00 PM 0 4,153
複製物件是 JavaScript 的實用技巧之一,十幾前我就學會用 jQuery.extend() 搞定,常見應用是結合參數預設值及函式傳入的設定值,例如: const defaults = { fontSize: '10pt', color: 'white', backgr...
2022-05-03 10:17 PM 0 3,598
自從宣告 IE 封印解除,我一改過去儘量用古老寫法以免惹 IE 生氣的保守心態,積極學習現代 JavaScript。猶如鄉巴佬進城,連看見自動販賣機也會大讚科技好進步。對專業前端開發人員來說,2022 年還在介紹這種基本常識簡直笑死,但心想「總有比我更晚解封的人」,還是拋開羞恥心(謎:不要提那種你沒...
2022-04-19 10:07 PM 9 5,208
隨著 IE 即將 EOS (野生 IE 將於 2022/6/15 滅絕,企業人工飼養 IE 則到 2029),IE Only 網頁都更如火如荼。而 showModalDialog 問題也來到第三篇,足見這議題還挺煩人的。 先整理之前的研究心得: 汰換 showModalDialog() 嘗試用 I...
2022-04-17 09:20 AM 2 3,320
前幾天幫同事看問題,要在 JavaScript 偵測 location.href 是否為 / 字元結尾,看到 Visual Studio 自動提示了 endsWith() 函式,大驚! JavaScript 不知何時早已內建 startsWith、endsWith (Chrome 41 就有,目前版...
2022-04-16 12:46 PM 0 11,039
我猜蠻多人跟我一樣,從沒上過 HTML/JavaScript 的課,甚至連書都很少買,寫網頁全靠著邊做邊學,上網複製貼上程式查資料慢慢養成。坦白說這不是最有效率的學習方式,但似乎是大部分有程式經驗的人跨界網頁開發常用的做法,也不能說是不長進不積極,就只是走平凡人走的路罷了。 我自己目前常遇的狀況,是...
2022-02-21 09:04 PM 0 1,057
系統有張表單包含一個使用者自訂區塊,允許業務單位放入備註性質資料讓使用者填寫,該備註只對承辦人員有意義,與作業程序完全無關,且各單位所而內容不同,偶爾會調整。思考了一下,我打算將其視為黑盒子不解析內容,採 Garbage In Garbage Out 策略,是較省時省力的做法。但有個問題 - 備註內...
2021-11-08 10:23 PM 4 5,251
上回試著克服 JavaScript 四捨五入浮點誤差,小看了浮點數誤差的千變萬化,只手動測完幾組數字就妄想過關,不意外地,被抓出兩個問題: 原先用整數跟小數總計 16 位判斷出現 999X 或 0000X 近似值誤差,但 JavaScript Number 規格位數上限是 17 位(A Numbe...
2021-10-08 09:20 PM 3 6,565
同事分享的浮點運算案例。 這些年大家都已知道「算錢用浮點,遲早被人扁」,差 0.01 都會鬧出人命的應用,在 C# 乖乖用 decimal 就對了,但說來奇怪。JavaScript 這些年紅透半邊天,不管前端、後端、行動裝置 App、物聯網裝置什麼平台都能沾上邊,偏偏在數字型別方面沒半點長進,還是只...
2021-10-04 09:56 PM 6 9,731
前陣子討論到 Chrome 88+ 加入的 Intensive Throttling 會造成 setInterval 大走鐘,同事提到可用 Worker 避開問題,發文後讀者 Scott 也留言提到。不過,在這個議題上,我覺得搬進 Worker 規避 Chrome 節能設計雖然省事但非最佳解,若有其...
2021-09-27 10:28 PM 6 9,913
同事分享踩到的地雷一枚 - 某個用 setInterval 寫的閒置倒數功能(參考:ASP.NET 小技巧 - 防止 Session 逾時與網頁閒置偵測),被發現超過時限很久還沒啟動。 經過調查,問題發生在 Chrome 瀏覽器,操作使用者曾長期切到別的頁籤看其他網頁,並未一直停在網頁。後來查到,今...
2021-07-30 07:20 PM 0 11,575
昨天講 Chrome 92 起禁止 IFrame 內嵌跨網站網頁 alert/confirm/prompt 一事時提到,IFrame 內嵌跨網站網頁時原本就有諸多限制,基於安全考量,禁止被內嵌的第三方網頁存取母網頁,也不允許母網頁存取第三方網頁的 DOM、JavaScript 物件,甚至想看一下 l...
2021-07-29 09:26 PM 7 9,027
同事分享一個 Chrome 92 版引發的新問題 - IFrame 內嵌的跨來源網頁將無法呼叫 alert/confirm/prompt。 依據 Chrome 官方資料 - Feature: Remove alert(), confirm(), and prompt for cross origin...
2021-07-12 06:34 AM 4 9,778
今天這篇屬於前端開發的單兵基本教練,練習為耗時的 AJAX 呼叫製作載入中狀態顯示,如以下效果: 針對較耗時的 AJAX 呼叫,在等待結果回傳期間顯示轉圈圈之類的載入動畫,安撫使用者情緒提供明確的執行狀態回饋,同時封鎖網頁介面並防止使用者在等待期間繼續操作造成動線混亂。這種效果相信大家一定都看過,...