jQuery Tips - 輔助介面顯示隱藏切換
 |  | 6 |  | 12,377 |
"小幫手"是我在設計網頁介面時常用的一種做法: 針對複雜的輸入操作，另外提供一個輔助性質的試算/查詢小幫手介面，讓使用者可以在上面進行一些數值試算、資料查詢，完成後再將結果填入。 由於這類小幫手介面有時還挺複雜的，若常駐在畫面上會讓操作介面變得龐雜。因此我習慣在網頁上放個小開關，按一下...
jQuery Plugin - 將欄位轉為JSON及還原
| | | 1 | | 19,127 |
Abstract: This is a small plugin to covert all input(text, checkbox, radio), textarea, select values into a JSON string, and the values in JSON stri...
邊做邊學 jQeury教學勘誤表-1
| | | 12 | | 12,335 |
文章埋藏各種錯誤，並以"野火燒不盡春風吹又生"之姿向世人展現旺盛的生命力，向來是敝人寫作時的一大特色，但隱隱以為這是我邁向專業作家路上的絆腳石呀! (長嘆) 即便交稿前看了又看，讀了又讀，每回總是會遺留幾個可恥的錯誤在文章中(恨)。我有點想效法SQL指令保險栓裡提到的副艦長、武器官複核模式加強校稿...
CODE-用jQuery實作<select>選項上下移動
| | | 11 | | 19,344 |
剛好有個需求要讓<select>裡的選項可以上下移動，落到本山人手上，想當然爾是用jQuery打死。 除了做了向上、向下鈕外，我還順手加上按【alt-向上】/【alt-向下】移動選項的快速鍵，沒想到程式碼比想像中還簡潔，忍不住貼文讚嘆一番! 嘖嘖嘖，短短兩個API串接: $op...
jQuery自動完成懶人包
| | | 78 | | 135,700 |
前陣子在專案中用了jQuery AutoComplete Plugin，感覺甚好，我想將來很可能會繼續用在其他專案上，索性做了一個範例懶人包以備未來不時之需，利人也利已。(我預估自己大概下個月就會忘記這次是怎麼寫出來的，所以這個懶人包對我來說也粉重要) 放了一個線上的範例網頁讓大家試敲，你可以輸入...
TIPS-jQuery.get整合BIG5編碼ASP
| | | 1 | | 11,517 |
直接用程式說明一下今天遇到的狀況，呼叫端是個純HTML網頁，用jQuery.get呼叫後端程式取得一段文字結果: <html xmlns="http://www.w3.org/1999/xhtml"> <head> ...
神乎奇技的jQuery Hacking
| | | 20 | | 25,562 |
十八歲的jQuery天才少年James Padolsey這回又讓我佩服到起了雞皮疙瘩... 一直以來，jQuery的語法有個小缺陷，就是在API中少了直接引用自己的捷徑。舉個例子來說，如果我想讓某個<div id='”dvX”>的寬度增加20px，常見的解法有兩種: $("#...
令人垢病的程式範例複製功能，終於改善了
| | | 3 | | 9,704 |
過去不少網友反映過我網站上的程式碼複製不易。 其實，我自己也身受其害... 有時要從以前的文章抄範例來用，用Firefox複製得到的結果會買一送一，每列都加附一列空白；用IE則是程式碼斷行通通消失。我後來試出一種克難解法是先Copy到Word，再由Word Copy出來，就能萃取出原汁原...
jQuery Textarea - 該用val()還是text()
| | | 9 | | 70,252 |
網頁在FF下不正常，搞了半天才發現問題出在我使用val()指定Textarea的內容，畫面顯示看來一切OK，但經過clone()後，內容值卻消失了。 我整理出以下的範例做測試: (可用Mini jQuery Lab直接執行) $("<div id='x1'><textarea ...
好用到掉渣的IE8 Developer Tools--JS效能調校經驗
| | | 22 | | 36,711 |
對我來說，IE8最讓人興奮的新功能非"IE8 Developer Tools"莫屬!! (沒騙你們，我有文章為憑: 1 2 3) 上市後，IE8立即取代Firefox成為我開發網頁時的主力測試工具，也開始體驗它的強大威力。 像是可任意下指令的Console視窗我就超愛...
jQuery ready vs load
| | | 25 | | 150,055 |
在使用Javascript操作HTML DOM時，記得要養成網頁載入後才動手的好習慣，不然會有可怕的事發生… (可參考邊做邊學 jQeury 系列 3-jQuery 常用的 Javascript 技巧教學影片，在5分02秒的示範) 在jQuery中，要做到"等網頁載入後再執行&quo...
關於jQuery AJAX cache參數
| | | 4 | | 44,578 |
網友DD04問到$.ajaxSetup({ cache: false })的用途，我寫了一個小範例說明: <%@ Page Language="C#" %><script runat="server"> protected void Page_Load(object...
jQuery XML selector在IE6下不支援逗號
| | | 3 | | 8,709 |
IE又來找碴了，這回闖禍的是IE6。 以下的程式(可使用Mini jQuery Lab測試) ，利用jQuery selector去查詢XML中的XmlElement，我有段類似的Code開發期間在IE7/8、FF、Chrome、Safari、Opera下都正常，直到今天交付User測試，User...
TIPS-小心IE7會偷改Anchor式HREF
| | | 8 | | 16,073 |
今天用jQuery UI Tabs做網頁，其中部分頁籤要動態產生，故現場組裝<li><a href='#divName'><span>tabName</span></a></li>，再呼叫.tabs()達到目的。測試發現，動態...
關於Checkbox Click事件的小發現
| | | 6 | | 35,620 |
我寫了一小段程式讓一群Checkbox具有單選的限制。理論上，單選改用Radio就好了，但在我接觸的一些需求中，使用者就是偏好方格打勾的呈現方式，比較貼近傳統紙張表單設計。 程式碼挺簡單的，利用class將幾個Checkbox歸成同一群，當其中任何一個被點選時，就將整群的Checkbox先全設為未...
Greasemonkey Script: 大圖自動縮小顯示
| | | 9 | | 24,433 |
宅神朱學恆Blog的文章除了一向犀利大膽外，極其豪邁的全尺寸圖檔(尤其是美女正妹圖)更是一大特色。不過，圖檔實在是太大了，即便用我的1280*1024螢幕檢視，若不捲動網頁，往往只能窺得正妹照片的一小角，必須由小得可憐的可視範圍推測那一大塊膚色到底是美腿還是伴隨入鏡狗狗的後腳? 頗有瞎子摸象之趣...