Java/JSP/JS Debug筆記

      ------------------------ 謹以此文獻給我沒有頭緒或心勁去debug的日子和很多辛苦debug的同志們。

      應部門一個科的需求，給他們寫一個夜維日志記錄的功能子產品，本來是個很小的需求，計劃一周内上線的，可能是我這個人比較偷懶，用了一點點以前略有不同的實作方式，搞得它之後的複雜需求都完成了，它那個子產品還由于bug重重沒有調試出來。

       本來這種子產品可以用4到5個頁面實作，為了圖友善，僅用了兩個頁面實作，導緻内容更新頁面代碼過多，是以在這個頁面，問題比較多。

      東西寫完基本代碼快一個月了，剛出來的那段時間，可能是比較忙或者身體、心情的原因，debug一直是一籌莫展，最近感覺心勁還不錯，把那個子產品拿出來慢慢debug,今天一天（有點其他的雜事）定位了2個bug，解決了一個，一個還沒有完全解決。

      第一個bug：這個夜維日志字段比較多，還需要上傳附件，本來附件上傳這個功能是比較熟悉的，可是我在附件上傳完以後其他參數的傳遞再顯示（在同一個頁面上傳附件，附件上傳的過程，其他編輯控件中的填寫值不變，這兒暫時沒有用ajax。）和修改時原日志的從java到填寫控件的值的傳遞才用了JS方式，就是在onload函數裡對input空間賦初始值，我不知道這種方法是否最優，隻是覺得這種方式在代碼的組織上非常好，可惜這種方式在這個子產品中我是第一次大規模用，可以說比較失敗：

              1、把window.onload編輯時編輯成了winodw.onload.

              2、在一個input空間指派的時候遺漏了<%=java variable>兩邊的''号;也就是因為這兩個原因導緻了向頁面的傳參失敗。也就是第一個讓人郁悶的“小”地方。JS的debug的确很考查人，難怪很多人都不喜歡用這個東西，第一：跨浏覽器需要相容，第二debug非常麻煩，差錯點很難發現，上一個子產品中有一個js的bug上線後才發現，還有一個上線N久都沒有發現，還是後來我在論壇上讨論的時候發現自己代碼那個地方有問題。

      第二個bug：編碼的問題，我們這個項目編碼問題本來是一次性解決的，但後來不知道怎麼回事，在運作server Weblogic上可以正确運作的Charset Filter在我的測試Server Tomcat上沒有效用，是以一般我在寫代碼的時候都要對測試代碼的參數處理自己要寫一下編碼處理。本來這個處理我以前用過，可是後來那種代碼在上線後就删除了，這次用到這種代碼的時候，一時居然找不到代碼，看了Charset資料寫出來的有問題，采用

            value=new String(value.getBytes(from_encoding),"to_encoding");

寫出來的代碼編碼以後并不能正确顯示，可能是今天馬上下班了，有點氣躁了（從這個問題發現自己真夠菜的！----Java基本功還很薄），可能是此處采用common upload元件作附件上傳處理，還不太清楚它的字段值是什麼編碼。問了一下同組的一位大拿，指點了一下，common upload的item.getstring()預設編碼方式可能是ISO-8859-1,是以需要使用getstring()的重載方法getstring("GB2312").代碼改了，還沒有上線測試——雜事太多。

      這個頁面還發現一個bug:删除的時候檔案名傳參還有問題，目前還沒有定位到此bug的差錯點。

      覺得Gmail的那種附件上傳方式不錯，決定嘗試一下！已經有人将它的原了解剖了（看http://howsmile.cnblogs.com/archive/2006/07/11/447837.html），不用我去啃GWT了。

       現在對GWT生成的JS和HTML比較感興趣，很想分析一下，可惜沒有時間和相關的分析資料。GWT的doc才看了1/3左右，很想看一下它生成代碼的結構和運作流程，有相關經驗和資料的同志可以留言一下，當然可能需要自己實踐一下，昨天在一個網站上發現一個GWT  Visual eidtor,就是一個基于eclipse的GWT可視化界面編輯器，不過剛剛放出Beta版本，且不提供下載下傳，需要發郵件申請，如果申請成功，給大家放出來------(主要是忘了收藏，連結也找不到了。用Firefox，沒存曆史。)

      10.24日今天在測試文檔管理子產品新功能時發現一個問題,select元素在disabled=true以後,就意味着其隻是一個顯示體了，在向後段送出請求的時候，也沒有了這個元素對應的參數，所幸今天這個元素的readOnly不甚重要，我則直接設定為普通元素，隻是賦了個初值。給一個相關解決此問題的索引http://www.cnblogs.com/dotage/archive/2005/05/16/156463.html吧

      順便，這幾天從老外的blog上面找到一個不錯的JS tab控件，比較好用，完全的用戶端代碼，可惜免費版左下角有一個小小的連結，把位址也給貼出來吧:http://codethat.com/tab/ ，這家公司挺有名的，不過國内好像大多用它的grid和table控件。

    10.27日在安裝上面提到那種iframe方式實作這個子產品的無重新整理上傳時，一個小間斷：給動态生成的一個元素的事件指派一個函數對象，需要給這個函數傳的參數也是動态生成的，這時候想到了把這個參數賦給這個元素的id,然後通過this傳參，找到了一篇文章《JavaScript中this關鍵字使用方法詳解》,這是我看過《ajax in action》某個章節後一直想看的一個話題，另外這個blog也不錯，文章比較多。

     10.30日，以前做的一個工作用的 java的swt的小程式，每次都打開eclipse來啟動比較麻煩，今天打了一下包，搜尋"java 打包 eclipse"裝了Fat Jar的eclipse打包插件，打好包，運作沒反應,又搜尋“swt 打包”找到《Eclipse SWT應用程式項目的打包與部署 》,原來swt程式需要與包jar同時部署它的本地dll檔案，fat jar+copy本地dll打包成功。

    11.2日，今日解決了某個*.js的檔案中的變量無法引用的問題，原因在于通過servlet轉向到jsp檔案，jsp檔案的目錄在firefox中是servlet的目錄，導緻原有的jsp中引用js的相對目錄失效所引起，是以js在伺服器上引用最好用伺服器絕對目錄。

         第二個問題比較讓人吐血，一個在firefox中通過html性質注冊的事件函數在IE下無效,最後試來試去,原來是函數名的問題，函數名不能是on**之類的元素事件性質的名字，否則就會導緻此處的時間性質無效。這個性質倒可以說非正常之大正常

   11.3日  今天發現了IE中iframe file upload無反應的原因，因為對top自定義的一個屬性好象不能成立。

firefox的删除調試也趨近完成，發現一個令人意外的東西：在FireFox中一個Element的childNodes裡面竟然把換行符當作是text元素算在内，是以要真對有意義的childNodes作周遊，最好前面用nodeType作一下過濾！

   11.7日 1、今天發現在FireFox中對NodeList周遊的第二個問題，如果你需要獲得一個Node的非Node屬性的其他如id之類的差別于nodeType的Element屬性，不能用直接以屬性名索引的方式如：(children=Element.childNodes;)children[i].id這樣的方式，而必須用children[i].attributes['id'].value這樣的方式，也就是說Node的類型不能實作動态判定，可惜我還不清楚js中怎樣把Node的類型實作動态轉換為具體的Element類型。

2、發現IE和FireFox給common fileupload上傳元件傳值的一個差别:IE傳給的檔案名的是完整路徑包括盤符和目錄，而FireFox傳給的就是檔案名。

    11.9日解決event.target為空或不是對象的問題，下把那張貼子貼出來吧:

  事件通過以下方式注冊:

    var delA=document.createElement('a');

    delA.id=attachfile;

    delA.className='delfile';

    delA.appendChild(document.createTextNode("X"));

    delA.οnclick=top.deleteFile;//注冊事件

    attLi.appendChild(delA);

    事件處理函數如下定義

function deleteFile(event){

    var url='.....';

    var params='attachid='+Event.element(event).id;

                           ~~~~~~~~~~~~~~~~~~~~Prototype的函數！

    .....

}

//IE6的報錯“為'target' 為空或不是對象”出錯的也就是這條語句：

也就是在prototype中的這條語句：

  element: function(event) {

    return event.target || event.srcElement;

  },

請問Event在傳srcElement的合理用法應該是怎樣，或者各位在這種方式的事件注冊方式下有什麼更好的給函數傳參的方式，也歡迎提出來。

   ps:今天這個問題和那天那個iframe的問題在FireFox下都不會發生。

   而且IE中還發生了"不能執行已釋放 Script 的代碼"這個架構代碼互相操作時的怪異問題，被迫将本來動态生成的poptip最後還是用DIV寫在了網頁裡再進行操作

——————————————————————————————————————

解 決,通過采用Prototype的事件注冊方式注冊事件處理函數即可。我在事件處理函數中alert判定了一下，發現event本身就不是所要的 event,是以IE根本沒有把事件傳遞進來，于是采用Prototype的注冊方式試了一下，因為我發現scriptaculous的事件處理代碼本身 并不作event是否為空的判定，卻可以正确的處理event，也就是說在IE中如果要代碼中注冊事件并傳遞event參數，必須采用Event的事件處 理模型(Element.attachEvent)注冊事件，才可以達到相應的目标，也就是意味着IE4以前的浏覽器，Prototype這種代碼就沒法 用了。

      上面這個bug解決了以後，雖然也出現了其它的bug，但總的今天比較順利，全部解決，至此這個日志子產品公開測試版開始交給配置管理者上線。

     總結一下：JS/JSP的調試非常瑣碎，需要極大的耐心和細心。比較便利的方法就是走比較正常的代碼路線，不要讨巧走邪路。

                                                                                       10.20日第一次更新

                                                                                       10.24日第二次更新

                                                                                       10.27日第三次更新

                                                                                       11.2日 第四次更新

                                                                                       11.7日第五次更新

                                                                                       11.8日第六次更新(最後一次)