checkbox

昨天發表了一篇很沒誠意的jQuery 1.1發佈的文章,是因為在研究checkbox的行為,因為想要用jQuery來抓checkbox和radio的值,radio還算簡單:

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

這樣一行就可以了,checkbox基本上也可以如法炮製,不過會遇到問題,可能有複數個checkbox的name屬性一樣,像是:

<input type="checkbox" name="pet" value="1"/>
<input type="checkbox" name="pet" value="2"/>
<input type="checkbox" name="pet" value="4"/>

這段HTML裡面有三個checkbox,他們的欄位名稱都是pet,但是值不一樣。假設全部都勾選,送出之後在HTTP header裡面會像是:

pet: 1
pet: 2
pet: 3

眼尖的人就會發現,在大部分的程式語言中,這樣會變成是重複宣告變數,後宣告的值會取代先宣告的值,以PHP為例,在後端程式收到的事實上等於只有$_POST['pet'] = 4;這個值,所以通常PHP程式設計師都會把checkbox的欄位名稱改成pet[],變成:

<input type="checkbox" name="pet[]" value="1"/>
<input type="checkbox" name="pet[]" value="2"/>
<input type="checkbox" name="pet[]" value="4"/>

這樣後端程式會變成收到一個陣列$_POST['pet'] = array(1,2,4);,其他後端程式語言會變成怎樣我比較不清楚,不過別忘了我是想用jQuery來取值,我努力了一個晚上,結果還是只能用一個function來處理,還沒辦法縮成一行直接在程式碼裡使用:

function getCheckbox (name) {
	var val = [];
	$("input[@name="+name+"][@checked]").each(function(){val.push($(this).val());});
	return val;
}

至於這樣做的原因?是要用來作ajax的資料傳輸用,透過jQuery來傳送表單可以使用JSON作為參數的格式,並不影響後端程式。ajax的form serialize和deserialize加PHP的php-json加上ADOdbAutoExcute,整個合起來超方便的:P。

最後補充,據說jQuery 1.1的選擇器(selector)的速度有大幅度的進步,快了10~20倍。

comments powered by Disqus