update: 簡易版的偵測 iphone/ipod time: 23:32 jQuery 真是一個相當方便的 javascript framework，最近在弄嵌入式系統時候需要去偵測瀏覽器 user agent，就類似下此訊息 “Mozilla/4.0 (compatible; MSIE 4.01; Windows 95)"，原本打算直接用 C 語言內建的 getenv(“HTTP_USER_AGENT”) 來做掉，不過後來想想，直接在 UI 那邊，利用 jQuery 來偵測瀏覽器版本、系統OS，這樣就解決了，上網找到有人寫了 jQuery browser and OS detection plugin，利用底下語法就可以知道一些 user agent 裡面的資料
[Read More]
CodeIgniter 文章，針對於剛入門 CI 的新手們，此篇教學如何使用 jQuery AJAX 搭配 CI 來驗證使用者帳號及相關資訊，本篇教學帶您如何在 CI 中發出 AJAX request 給伺服器端。 請先在網頁 header 自行 include jQuery 檔案，或者可以使用 Google AJAX CDN 方式來讀取，將底下程式碼放到之前：
$(document).ready(function() {
/* 先停止讀取狀態 */
$('#Loading').hide();
/* 填寫好 email 欄位，按下 Tab 會進行讀取 */
$('#email').blur(function(){
/* 讀取 email 欄位 */
var a = $("#email").val();
/* email 正規語法 */
var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;
/* 簡易驗證 email */
if(filter.test(a)){
/* 讀取狀態 */
$('#Loading').show();
/* AJAX 比對資料庫 */
$.post("controller_name/check_email_availablity", {
email: $('#email').val()
}, function(response){
/* 驗證後讀取 reponse 狀態 */
$('#Loading').hide();
setTimeout("finishAjax('Loading', '"+escape(response)+"')", 400);
});
return false;
}
});
[Read More]
今年在 COSCUP 大會上最主流的議題就是 Html5，今天看到一個網站 HTML5 Boilerplate，這網站提一個全新 html 5 模板，自從離開 Dreamweaver 樣板軟體，利用 Pspad 手動撰寫 html，此網站就發揮非常大的用處，提供全新 html，CSS 以及 javascript，支援了底下很多功能：
為了慶祝 jQuery 四週年慶，官方網站終於 Release 1.4 版本了，也大幅度修改了 jQuery API 網站，跟以往一樣，jQuery 提供兩種版本讓大家測試跟下載：jQuery Minified (23kb Gzipped)，這版本是利用 Google Closure Compiler 去壓縮，以往好像是用 YUI Compressor，另一版本就是沒經過壓縮：jQuery Regular (154kb)，當然 Google 也提供了 host 來讓 jQuery 有 cache 檔案作用，增加網站速度： http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js 1.4 版本的出來，最主要就是效能的改善，以及整個 Code Base 翻修，可以參考 John Resig 寫的 JavaScript Function Call Profiling，看到底下的圖，就大致上知道 1.4 的效能改善 
.css() and .attr() 效能改善圖： 
整篇都在說明 jQuery 效能的部份，真的是改善很多，Media Temple 主機商也贊助 jQuery 14天的徵文活動，大家可以上去看看有很多影片都是在介紹 jQuery，最後得獎的人可以獲得 13" MacBook Pro，真是太吸引人了。 最後可以參考 黑暗執行緒大大寫的：jQuery 1.4 小閱兵
在 Oceanic / 人生海海 看到這篇 thickbox 停止維護，ThickBox jQuery plugin 裡面算是不錯用的工具，在網路上常常會聽到這個名詞，thickbox 作者也推薦了底下類似套件：
fancybox 的，目前開發專案都以它為主，因為在瀏覽整頁圖片，我覺得效果不錯，剛剛去 try 了一下 colorbox，發覺這套也不錯用。在 fancybox 裡面設定 zoomSpeedIn 或者是 frameWidth 的值，就直接設定數字，不用在加上引號，不然會沒出現效果。
$(document).ready(function() {
$("a.group").fancybox({
'zoomSpeedIn': 300,
'zoomSpeedOut': 300
});
});驗證 form 表單屬於前端的工作，非常重要，避免使用者填錯格式，當然在 jQuery Plugin 可以找到專門驗證表單的外掛：jQuery plugin: Validation，此外掛不能相容於 IE 6，會沒辦法呈現效果，google 到一篇解決方法：Validating not happening in IE6 & no error removal on keyup，這篇裡面提到，必須使用 un-packed and un-minified 的版本，也就是沒有壓縮過的 javascript 檔案，不過我自己沒有試過就是了，底下針對表單的 checkbox select input radio 欄位做檢查的筆記，可以讓大家參考看看。 在 jQuery 1.3 裡面正式拿掉 [@attr] 的寫法，所以以前寫 $(“input:radio[@name=reg_sex]”) 都要改成 $(“input:radio[name=reg_sex]”)，這樣才是正確的，可以參考 jQuery Selector 這篇的 Attribute Filters 部份，先來一篇網路上實做提示說明在 text 來未：jQuery: show plain text in a password field and then make it a regular password field on focus 作法很簡單：建立兩個輸入 password 的 text input 欄位：
[Read More]