2007年1月22日 星期一

jQuery: 實用 plugins(1) form.js

利用 jQuery 的 selector 來 find Element 再操作非常的容易也愉快!
如取 radio 的值 :

$("input:radio[@name=fieldname][@checked]").val();

這樣一行就可以得到 checked RadioBox 的 String Value.

然而,同樣的程式在 Checkbox 或 Multi-Select 就行不通了。
##CONTINUE##
為了充分利用 jQuery 的 Chainable ,可能會嘗試程式碼:

var values = [];
$("input:checkbox[@name=fieldname][@checked]").each(function(){ values.push($(this).val())});
return values;

怎麼樣也沒辦法在一個 chainable statement 寫完。


Form.js 登場:
在 jQuery plugins 中有個 form.js 的 plugin,pack 完後只有 4K,可以讓 field 的求值表現的更加美麗,同上的例子,可以統一改變如下, 無論是 radio, checkbox, multi-select:


$("input:checkbox[@name=fieldname").fieldValue();


會自動回覆 String(input=text, textarea, radio, checkbox, select) or Array of String(checkbox, multi-select).

另幾個好用的特性是 formSerialize 將整個 Form 轉成 QUERY_STRING 的字串。
fieldSerialize 類似 formSerialize 只是將選擇的 element 轉成 QUERY_STRING。
張貼留言