客戶的需求中，「當使用者至少要選取一筆資料才能進行下一個動作」。常見的 UI 設計，當然是使用 checkbox。
而我的 case，是資料有一萬多筆，此時整個網頁非常痴肥而難以接受。問題是，客戶就是要這樣的網頁，客戶拒絕分頁。
jQuery length
問題來了，此時我使用了如下的 jQuery 語法查詢是否有選取一個 checkbox
var isChecked = $('input[name=chk]:checked').length > 0;
相當然爾，網頁就硬生生當在那裡，動也不能動。效能不好
jQuery is
根據我「多年」「 .NET」的經驗，使用 length 等同於計算所有被勾選的項目，然後再計算出總筆數，這樣的效能當然不好啊。於是趕快找一找 jQuery document，很快的就發現了 jQuery is 非常符合我的需求。於是馬上改了程式
1: var isChecked = $('input[name=chk]')is(':checked');
滿心期待效能飛快，但「更慢了」。怎麼會…
效能比較
找到一個測試，也證實了這樣的結果。怎麼會這樣…
另外，又找了一個 checkboxtests，這次加入了自己寫的 .each() 來測試是否會比較快？結論是：不會。
心得
到了 javascript 的世界，以前許多經驗值就必須大打折扣了。
4 則留言:
如果先隱藏一個 textbox 在後面, 加一個checkbox checked 事件去更新 textbox 內容呢? 更新時只要讀 textbox 就可取得 checked checkbox 的筆數及內容.
這樣做也是 ok的。不過我的case是，網頁顯示時，預設全選。使用者通常會直接送出網頁，因此沒有機會更新 textbox 的內容。
所以您的方法目前不適用我的狀況。
若用以下判斷會較快嗎?
只取取有勾選的第一個：
$('input[name=chk]:checked:first').length > 0
花了點時間寫了一點小測試，好像沒有文章中說的那麼慢? 不知是什麼問題，不過is()確定是最慢的。
http://jsfiddle.net/M9kqw/1/
你一萬筆資料載入到瀏覽器，這整個HTML內容是很大的，你想，需要吃掉多少記憶體，以及用到多少硬碟空間當記憶體分頁，所以當然會卡啊，若是用IE瀏覽器的話，會崩潰，因為IE8以下的JAVA引擎很爛，只要執行比較大的javascript運算，就卡卡，要不然就是無法執行，用Chrome就不會，要在整個一萬筆資料裡面用javascript去檢查，首先在操作的電腦一定要強，再來用Chrome瀏覽器瀏覽!!
張貼留言