一次Ajax查錯的經(jīng)歷
先說故事，再說想法吧。
我有一朋友做網(wǎng)站，用 jQuery 的 Ajax 方法從后端載入一段 HTML 代碼然后動態(tài)插入到網(wǎng)頁的 p 元件中。這個東西太普遍了。jQuery 強大的 load 方法可以完成這個事情。朋友的代碼是這么寫的：
- var tab = jQuery ("#dynamic_tab");
- var url = "/list_ajax/";
- tab.load (url);
簡單到不能再簡單了。在 Chrome，F(xiàn)irefox，Safari 下運行一點問題也沒有，只有 IE 不行，不管是 IE7，IE8，還是 IE9。問題的癥壯是，使用 IE 訪問那個 Ajax 的鏈接，沒有問題，但是在 jQuery 的 Ajax 方法返回了“undefined”的 respons 對象。沒有任何報錯！
怎么搞也搞不定，只好 Google 了一下——“jQuery load IE”，一看，很多人都在問這個問題。于是開始了散彈槍編程方式。
排在第一的就是 StackOverflow 被瀏覽了 33K 次的這個問題：jQuery’s .load () not working in IE – but fine in Firefox， Chrome and Safari，答案沒有被打勾（不靠譜），StackOverflow 還有很多人問相似的問題，不過都沒有答案。不管三七二十一，先試了一下，散彈槍嘛。試了半天都沒有用。
然后上 Google 查，又看到有人說的 IE 緩存的問題，什么，要把 cache 設(shè)置成 false，或是用下面的方法來解決：
- var tab = jQuery ("#dynamic_tab");
- var fuckie = Math.random ();
- var url = "/list_ajax/"+"?fuckie="+fuckie;
- tab.load (url);
反正還是一樣，統(tǒng)統(tǒng)不 Work，幾乎所有的都試了，都不 Work。搞了一天的朋友惱怒道：“Microsoft 應(yīng)該快點倒閉吧，產(chǎn)品太爛了”。IE 的確是太爛了。
于是我用 IE9 的網(wǎng)頁調(diào)試器可以看到點了 Ajax 的鏈接后，IE 對網(wǎng)站有 http 的 Ajax 請求，也可以看到請求返回了，但是就是不顯示在我的頁面上——jQuery 的 Ajax 的 responseText 為 undefined!
對于我這個老家伙，對 jQuery 也不熟，我只得開始調(diào)試 jQuery 的代碼，想看看里面干了什么，報了什么錯？調(diào)了一個小時，基本上把 jQuery 的 Ajax 的封裝看懂了七七八八了，但是還是沒找到為什么有問題。
于是，我只得架起原生態(tài)的 Ajax，看看 IE 的那個 Ajax 的 ActiveX 的對象干了什么事？寫了下面的代碼（當(dāng)年寫 Ajax 就是這么寫的，所以也不費勁，況且網(wǎng)上還有例程可以抄）：
- function InitAjax ()
- {
- var ajax=false;
- try {
- ajax = new ActiveXObject ("Msxml2.XMLHTTP");
- } catch (e) {
- try {
- ajax = new ActiveXObject ("Microsoft.XMLHTTP");
- } catch (E) {
- ajax = false;
- }
- }
- if (!ajax && typeof XMLHttpRequest!='undefined') {
- ajax = new XMLHttpRequest ();
- }
- return ajax;
- }
- var ajax = InitAjax ();
- ajax.open ("GET", url, true);
- ajax.onreadystatechange = function() {
- if (ajax.readyState == 4 && ajax.status == 200) {
- var show = document.getElementById ("HaoChenp") .value;
- show.innerHTML = ajax.responseText;
- }
- }
- ajax.send (null);
一運行，還是不行，沒見 IE 報什么錯，不過，可以確定這不是 jQuery 的問題了，估計還是我們自己程序的問題。不過此時的程序太好調(diào)試了，調(diào)試中，在 IE9 下調(diào)式發(fā)現(xiàn)原生的 IE 的 Ajax 對象在 onreadystatechange 函數(shù)里，其 responseText 是下面這個樣子：
什么是“系統(tǒng)錯誤: -1072896658”？上 google 一查，一堆頁面，基本上是說亂碼了，也就是 ajax 的后端程序返回的網(wǎng)頁編碼不認識吧。需要在返回的 http header 里加上 charset=utf-8。
于是，修改后端的 Ajax 的后端程序，明確指定了返回的 HTTP Header 中的 charset，于是 IE 下就工作正常了，再切回 jQuery 的 load 代碼，一切正常了。
舉一反三，這個問題的原因就是因為我們沒有按照規(guī)范去寫網(wǎng)頁。所以，舉一反三，HTML 的規(guī)范還有哪些，太多了，記也記不住。但也許你會知道有一個叫 http://validator.w3.org 的網(wǎng)站可以幫你校驗?zāi)憔W(wǎng)頁中的很多不規(guī)范的東西。
后記
我把這個問題和過程分享出來，主要有這么幾個目的，并拋出幾個問題，大家可以思考一下：
1）這個問題網(wǎng)上有很多人都在報，但是基本上找不到答案（包括 StackOverflow），所以，我分享出來，填補一下空白。
2）我相信我們的程序員天天都在經(jīng)歷這樣的事，我不知道大家在遇到這樣的事情會怎么做？也許大多數(shù)人都在網(wǎng)上查各種解決方案，然后一個一個的試，直到試對了——散彈槍式的編程，呵呵。當(dāng)然，大多數(shù)答案都是可能找到的。但當(dāng)我們找到答案了后，我們還會深入去了解這個問題的具體原因并舉一反三地去思考一其周邊的東西嗎？
3）另外，在今天這樣N多框架，N多 lib，N多開源的年代下，不知道大家有沒有失去了從零開始自己寫代碼的能力？比如上面的這個問題，不知道有多少人還會自己寫原生態(tài)的 Ajax？不過，我還是建議大家能在使用各種框架的時候，明白那些最基礎(chǔ)的知識，求甚解，知其然知其所以然，真的很重要。
我是從那個“吃糠的年代”過來的程序員，那些的程序員什么都要自己干，很辛苦，今天我和很多人說我以前的那些經(jīng)歷，會被笑話，但是我從這些什么都自己的干的年代過的經(jīng)歷，讓我受益很多。我把我的想法分享給大家，希望對大家有用。
原文鏈接：http://news.cnblogs.com/n/155378/
【編輯推薦】
【責(zé)任編輯：張偉 TEL：（010）68476606】
