Browse by Tags

jQuery-利用上下左右鍵移動輸入焦點

今天同事詢問如何在網頁實作以上下左右鍵移動輸入焦點的效果，我寫了一個jQuery解法示範，順便貼出來跟大家分享。 範例中有4x4共16個矩陣狀排列的<input>，我先用each("tr") each("td")為每個<input>標上tabindex。每列的tabindex相差100，如此加減100就可以跳到上下列的同一欄。統一為<input>加上cGridInput Class Name，方便後續以selector一次選取...

Posted 06 October 2009 09:32 AM 由 Jeffrey | 3 comment(s) 21,469

Filed under: jQuery, CODE

CODE-ASPX接收jQuery.ajax傳送XML文件範例

今天應用到以jQuery.ajax送出XML文件，以ASPX接收處理的寫法。在倉庫挖了好久，才找出不久前剛寫過的程式碼參考。為了避免中年記憶衰退成為我活到老，Coding到老路上的絆腳石，整理一下程式貼成KB，也順便與有此需求的鄉親們分享。 HttpRequest要傳遞整份XML文件時，並不是將XML字串放在參數中，而是把整個XML內容當成POST Request的主體，因此在jQuery端與ASPX端跟一般呼叫寫法有些不同。 傳送時，必須直接使用jQuery.ajax()以精確調控參數，沒法用...

Posted 02 October 2009 04:12 PM 由 Jeffrey | 5 comment(s) 23,431

Filed under: ASP.NET, jQuery, CODE

輕量級的js檔打包解決方案

最近在嘗試將一個功能強大的jQuery Plugin【 jqGrid 】整到專案裡，它的功能與彈性讓人印象深刻(不過要上手得花點時間摸索)，大家可以直接看 線上展示 ，應該就能感受其威力。 jqGrid有個貼心的設計--將功能模組化。各模組的程式分散在多個js檔，有用到才需要載入，避免Client端載入肥大js只使用其中一丁點功能，白白浪費載入時間及頻寬。(剛好前些時候James Padolsey也提到 這點 ，甚至覺得殺雞不必用牛刀，小功能或許自己寫會更有效率兼便練功) jqGrid提供了兩種做法...

Posted 18 September 2009 05:51 AM 由 Jeffrey | 8 comment(s) 25,621

Filed under: Javascript, ASP.NET, jQuery, CODE

jQuery Plugin - 將欄位轉為JSON及還原

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 string can be restored to fields back latter. 專案裡有個小需求，要將<DIV>中的input(text, checkbox, radio), textarea...

Posted 23 August 2009 01:47 PM 由 Jeffrey | 1 comment(s) 18,833

Filed under: jQuery, CODE

CODE-用jQuery實作<select>選項上下移動

剛好有個需求要讓<select>裡的選項可以上下移動，落到本山人手上，想當然爾是用jQuery打死。 除了做了向上、向下鈕外，我還順手加上按【alt-向上】/【alt-向下】移動選項的快速鍵，沒想到程式碼比想像中還簡潔，忍不住貼文讚嘆一番! 嘖嘖嘖，短短兩個API串接: $opt.next().after($opt)就做出了<option>向下移動的效果。記得以往用純Javascript寫，還得判斷是否為最後一個，若是就不能下移；然後上下位置交換得用options[index...

Posted 18 July 2009 11:22 AM 由 Jeffrey | 11 comment(s) 20,333

Filed under: jQuery, CODE

GridView的標題欄、列凍結效果(跨瀏覽器版)

稍早發表了 GridView的標題列凍結效果 ，足以滿足工作上的需求，不過存在兩個缺點: 只支援FF及IE6/7、只能凍結列不能凍結欄(行)... 不甘心事情只做一半，又挖了一下，驚喜地發現另一個版本: Super Tables ，可以支援Firefox 2+, Internet Explorer 5.5+, Safari 3+, Opera 9+ 以及Chrome，而且也支援直欄的凍結效果，在功能上大勝ScrollableTable，二話不說，通通包起來。 SuperTable的原理與ScrollableTable不同...

Posted 18 February 2009 12:10 AM 由 Jeffrey | 70 comment(s) 254,340

Filed under: ASP.NET, jQuery, CODE

GridView的標題列凍結效果

應該有不少人被這麼要求過吧? "你們做的網頁表格為什麼不能像Excel一樣凍結標題列，底下捲來捲去也不會跑掉?" 前陣子看到一個不錯的Javascript Library，只用一行Code就可以輕鬆做出HTML表格列凍結的效果，剛好部門裡也常有這種需求，我就弄了一個簡單的範例。 大家可以先看 Scrollable HTML Table Plugin 的 範例 ，它本來是個 純Javascript Library ，Plugin只是做了簡單的包裝，把new ScrollableTable...

Posted 17 February 2009 03:37 PM 由 Jeffrey | 6 comment(s) 31,759

Filed under: ASP.NET, jQuery, CODE

CODE-用Javascript刪除ASP.NET寫入的Cookie

今天要挑戰的是用Javascript刪除ASP.NET寫入的Cookie。 Client-Side本來就可以由document.cookie取得Cookie，其為一字串，格式類似cookie1=value1;cookie2=value2;cookie3=value3，要用得自行拆解，但不乏現成的共用函數可以代勞。若網頁有引用jQuery， jQuery Cookie Plugin 是不錯的選擇。 要用jQuery Cookie Plugin刪除Cookie可以寫成$.cookie("CookieName"...

Posted 06 February 2009 10:03 AM 由 Jeffrey | with no comments 15,148

Filed under: Javascript, ASP.NET, jQuery, CODE

CODE-抛棄式Javascript匿名函數的使用

來試試用程式碼寫Blog... //網友wangaguo詢問以下Javascript表示法的用意 ( function (m) { alert(m); })( "Hello" ); //以上的寫法相當於 var x = function (m) { alert(m); } x( "Hello" ); //或是再傳統一點, 用具名函數來示範 function y(m) { alert(m); } y( "Hello" ); //以上三種寫法結果相同...

Posted 17 January 2009 03:42 PM 由 Jeffrey | 2 comment(s) 17,965

Filed under: Javascript, jQuery, CODE

搜尋