Jemmy Walker

　　Java Script的世界一向隨便，非我族類的一套library反而是種嚴謹，而對習慣隨便寫Java Script的我，花了半天才找到解法。問題如下：

　　jQuery真是夠了。可以在Google Chrome work的addClass竟無法在IE8和FireFox 3上Run。原因竟是each這個迴圈，結果我習慣用break跳出迴圈在Google Chrome沒事，結果在jQuery真正的跳出迴圈關鍵字是return。

　　以前學Perl是羨慕其散漫不拘乃至天馬行空的語意邏輯，但始終我只是個Perl的入門者。jQuery也有這種傾向，先記錄我在SelectBoxes這個plugin遇到的怪事之二、三。

　　第一件，SelectBoxes似乎會cache，假設<select>是用addOption新增，順序是<option 1>、<option 2>、<option 3>，若是用jQuery的empty()或html('')清空，再用addOption新增<option 3>、<option 4>，結果<option 4>會出現在<option 1>的第一個位置，<option 3>在第三個位置，而<option 2>的位置卻是空著一列。若使用removeOption(/./)清空，則無此現象。

　　承襲前篇，欲將Popup Dialog裡的一個Select Box所有的值，以JSON方式回call父視窗的JavaScript function。但很奇怪的是，若JSON長得像這樣：

[{"username":"Foo","userid":2},{"username":"Bar","userid":1}]

　　想在下拉選單初始化時，預設選擇一個Option，蠻簡單的：$('#selectBoxID').val('Taiwan')。val帶的參數是<option>的value屬性，而非標籤裡的資料。

　　第二種情形是，想預設第一筆被選，而不會事先知道value。有兩種作法：

　　Struts1的Tag library轉成html，只有name，沒有id，因此jQuery很難用id selector去過篩。比如想在<html:text>標籤加個日曆小工具，得用name selector去篩選，在JSP設置jQuery的DatePicker的plugin如下：

　　Struts1和jQuery越深研，學越多，狀況越多。最意外的是還有瀏覽器不相容的問題，原本在Google Chrome下可work的，到IE和FireFox便出錯，而且錯得都不一樣，馬的。IE問題出在CSS的問題，果如Java Script的大老道格拉斯在OSDC 2010說：IE 6 MUST DIE。我看IE8也…。

　　先列出解出和FireFox的問題。原來出在Struts的RequestProcessor的類別，我在JSP使用jQuery的$.ajax去做post，其url設定為/query.do，在Google Chrome裡，印出的Log是這樣：[RequestProcessor.java:161] : Processing a 'POST' for path '/query'。

　　DataTables.js是jQuery plugin裡較方便、設定較少的分頁表格功能。Google結果大多只有DataTables.js內容轉成JSON的飯粒，反過來較少，也是筆者在前端不熟稔所致，踹了快一週才找到方法，而且歷經SiteMesh和出現中文亂碼的問題。

　　先說為何選用JSON作為資料傳遞格式，JSON和XML一樣皆屬通用型格式，同樣意涵的資料在JSON裡表達可能占的空間更少。利用通用型格式可以讓前端與Web Server之間更鬆耦合，前端可以是JSF、Flex…，後端可以是Struts、Spring MVC甚至是.Net平台。

　　一流+一流=二流。一個優秀的元件可以獨當一面，甚至包山包海，當再遇到另一個優秀的元件，雖然獨當的一面不同，但週邊的能力可能踩到對方的地盤了，這是我花兩天才找出原因的。

　　jQuery使用Ajax向Server端取得JSON格式，卻老是出錯：

　　jQuery的"$('.test :hidden')與"$('.test:hidden')之間差異做了幾次才明白。

　　以空白隔開的叫做後代選擇器(Descendant Selectors)，以下的"$('.test :hidden').length值為4，先找出class為test的，再其下的子元素俱:hidden的性質：