5個(gè)常見的Ajax問題的解決方案

現(xiàn)代的Web開發(fā)人員不考慮Ajax在規(guī)劃或建設(shè)自己的網(wǎng)站，可能是錯(cuò)過(guò)了一個(gè)強(qiáng)大的工具來(lái)提高可用性。

在網(wǎng)頁(yè)設(shè)計(jì)上實(shí)現(xiàn)Ajax功能的挑戰(zhàn)，5個(gè)常見的Ajax問題的解決方案

在這篇文章中我們將討論解決成都網(wǎng)站設(shè)計(jì)五個(gè)最常見的挑戰(zhàn)，使用Ajax增強(qiáng)內(nèi)容在網(wǎng)站上，雖然有很多討論和研究所有五個(gè)話題，這個(gè)職位應(yīng)該給初學(xué)者和中級(jí)Ajax開發(fā)者一些堅(jiān)實(shí)的技巧實(shí)現(xiàn)Ajax功能更方便和易于理解的方式。
問題1：#內(nèi)容不向后兼容
出現(xiàn)此問題時(shí)，設(shè)計(jì)師已經(jīng)將JavaScript和Ajax增強(qiáng)到他們網(wǎng)站的架構(gòu)沒有為已禁用JavaScript的瀏覽器規(guī)定。
什么是JavaScript和Ajax網(wǎng)站的錯(cuò)誤，JavaScript的考慮應(yīng)該是規(guī)劃過(guò)程的組成。但你還是應(yīng)該確保網(wǎng)站是向后兼容。
解決方案：實(shí)現(xiàn)Ajax作為增強(qiáng)一個(gè)已經(jīng)運(yùn)作的網(wǎng)站
雖然Ajax可能對(duì)你的網(wǎng)站的整體的架構(gòu)規(guī)劃，確保所有內(nèi)容都可以通過(guò)常規(guī)的服務(wù)器端方法。
讓我們說(shuō)你有一個(gè)“員工信息”頁(yè)面，有一個(gè)單獨(dú)的鏈路為每個(gè)員工。使用服務(wù)器端的技術(shù)，你可以顯示一個(gè)基于通過(guò)查詢字符串的值的特定員工的內(nèi)容，這樣：

所有上面的鏈接指向同一個(gè)頁(yè)面，在“員工”的網(wǎng)頁(yè)，并根據(jù)變化的變量在查詢字符串。每個(gè)員工的信息將從服務(wù)器加載，可以做多種途徑：通過(guò)服務(wù)器端；通過(guò)數(shù)據(jù)庫(kù)；甚至使用XML。
無(wú)論員工鏈接被點(diǎn)擊時(shí)，頁(yè)面會(huì)加載為請(qǐng)求的信息被傳遞。
因此，在任何Ajax增強(qiáng)層之上的內(nèi)容是完全可以的。然后，使用JavaScript，全頁(yè)面刷新可以中斷和內(nèi)容而不是通過(guò)AJAX加載。點(diǎn)擊鏈接可以通過(guò)ID或通過(guò)檢查在錨href屬性的值確定。
雖然內(nèi)容是完全可以禁用javascript，大多數(shù)用戶會(huì)看到增強(qiáng)的AJAX驅(qū)動(dòng)版本。
對(duì)Ajax的漸進(jìn)增強(qiáng)的原則是眾所周知的，因?yàn)樗浅Ｓ玫腏avaScript技術(shù)和固有的CSS，由下圖所示：

因此，建立你的網(wǎng)站沒有JavaScript，然后添加JavaScript作為一種增強(qiáng)，就像你將你的HTML內(nèi)容，然后“增強(qiáng)”與CSS。
問題2：#瀏覽器加載指示器不通過(guò)Ajax請(qǐng)求觸發(fā)
幾乎所有的瀏覽器有一種直觀的顯示給用戶的內(nèi)容是加載。在當(dāng)前的瀏覽器，指示出現(xiàn)在標(biāo)簽的加載內(nèi)容。
下面的圖像顯示，這部動(dòng)畫的指標(biāo)從幾個(gè)流行的瀏覽器。

問題是，Ajax請(qǐng)求不會(huì)觸發(fā)這個(gè)“加載”指標(biāo)，內(nèi)置的瀏覽器。

解決方法：插入一個(gè)類似的負(fù)荷指標(biāo)接近的內(nèi)容，加載
這種常見的解決方案是將一個(gè)自定義進(jìn)度指示器為Ajax請(qǐng)求。許多網(wǎng)站提供免費(fèi)的“加載”的圖形。

實(shí)現(xiàn)自定義加載圖形，或進(jìn)步的指標(biāo)，為你的網(wǎng)站的Ajax功能只是一件簡(jiǎn)單的顯示和隱藏它在適當(dāng)?shù)臅r(shí)候通過(guò)JavaScript。
Ajax代碼將包括代碼行，告訴你如果請(qǐng)求是在進(jìn)步或完成。使用JavaScript，你可以顯示動(dòng)畫圖形而請(qǐng)求被處理后，把它藏在動(dòng)作已經(jīng)完成。

問題3：#用戶不知道一個(gè)Ajax請(qǐng)求完成
這與以前的問題卻往往被忽視，因?yàn)殚_發(fā)人員可能會(huì)認(rèn)為消失的“加載”指標(biāo)可以通知用戶的內(nèi)容已經(jīng)完全加載。但在大多數(shù)情況下，它顯示的內(nèi)容已經(jīng)更新或刷新更好。
解決方案：使用一個(gè)獨(dú)特的“請(qǐng)求完成”的消息
這可以通過(guò)類似于表單提交確認(rèn)。在聯(lián)系已經(jīng)提交掘客的頁(yè)面，讓你知道得很清楚，你的提交已收到：
Digg的形式提交指示器
雖然這個(gè)指標(biāo)沒有指出完成Ajax請(qǐng)求，原則是一樣的：“成功”的對(duì)話框出現(xiàn)后，提交表單的頁(yè)面加載完成，和盒子是豐富多彩的，不同的。
一個(gè)類似的圖形或指標(biāo)可以用來(lái)在一個(gè)Ajax請(qǐng)求告訴用戶的內(nèi)容已經(jīng)更新結(jié)束。這是除了實(shí)施，而不是以前的問題，提出了進(jìn)度指示器。
一個(gè)類似但微妙的方式表明，一個(gè)區(qū)域的內(nèi)容已經(jīng)更新為黃褪技術(shù)。這種方法是為用戶所熟悉，而工程與Ajax加載內(nèi)容。

問題4：# Ajax請(qǐng)求無(wú)法訪問第三方網(wǎng)站的服務(wù)
這個(gè)對(duì)象對(duì)象，這是在所有的Ajax請(qǐng)求的根，是限制要求在同一域?yàn)榘l(fā)出請(qǐng)求的頁(yè)面。但有時(shí)當(dāng)你想通過(guò)一個(gè)Ajax請(qǐng)求的訪問第三方數(shù)據(jù)。許多Web服務(wù)使他們的數(shù)據(jù)可以通過(guò)一個(gè)API。
解決方案：使用你的服務(wù)器作為代理
解決這個(gè)問題的辦法是使用你的服務(wù)器和瀏覽器之間的第三方服務(wù)代理。雖然該方案的細(xì)節(jié)遠(yuǎn)遠(yuǎn)超出了本文的范圍，我們會(huì)去的基本原理在起作用。
因?yàn)橐粋€(gè)Ajax請(qǐng)求來(lái)自客戶端的瀏覽器，它必須參考文件在另一位置，但在同一個(gè)域作為請(qǐng)求的源。

您的服務(wù)器，但不同于客戶端的瀏覽器，不是以這種方式限制。所以，當(dāng)你的服務(wù)器上的頁(yè)面被調(diào)用，它在后臺(tái)運(yùn)行，因?yàn)樗ǔ?huì)同時(shí)訪問任何域。
這不存在任何安全隱患的用戶因?yàn)榈谌椒?wù)的請(qǐng)求是在您的服務(wù)器上。所以，一旦信息被服務(wù)器級(jí)的獲得，在Ajax調(diào)用的下一步是把響應(yīng)返回給客戶端，這將包括從第三方的Web服務(wù)中獲得的數(shù)據(jù)。

問題5：#深層鏈接不可用
這是一個(gè)棘手的問題，但不可能取決于你的網(wǎng)站或應(yīng)用程序類型的要求。發(fā)生問題時(shí)，內(nèi)容是通過(guò)AJAX加載，那么“國(guó)家”的網(wǎng)站是沒有指向的頁(yè)面的URL改變的影響。
如果用戶返回到頁(yè)面通過(guò)書簽或與朋友分享的鏈接，更新的內(nèi)容將不會(huì)自動(dòng)顯示。該網(wǎng)站將恢復(fù)到原來(lái)的狀態(tài)。Flash網(wǎng)站曾經(jīng)有過(guò)同樣的問題：他們不允許用戶鏈接到任何但初始屏幕。
解決方案：使用內(nèi)部頁(yè)面的錨
確保一個(gè)特定的“國(guó)家”一個(gè)AJAX驅(qū)動(dòng)網(wǎng)頁(yè)鏈接和書簽的，你可以用內(nèi)頁(yè)鏈接，修改URL而不刷新頁(yè)面或影響其垂直位置。
這個(gè)簡(jiǎn)單的代碼演示了如何做到這：
無(wú)功currentanchor =文件位置；
currentanchor =字符串（currentanchor）；
currentanchor = currentanchor。分裂（“#”）；

如果（currentanchor.length > 1）{
currentanchor = currentanchor [ 1 ]；
} {
其他
currentanchor = currentanchor [ 0 ]；
}

開關(guān)（currentanchor）{
案”第一節(jié)“：
/負(fù)載的內(nèi)容1節(jié)
打破；

案”“”：
/負(fù)載的內(nèi)容2節(jié)
打破；
案例“節(jié)”：
以上是不是一個(gè)功能塊代碼，而是一個(gè)理論的例子來(lái)證明所涉及的主要步驟。
代碼的前兩行把當(dāng)前頁(yè)面位置（URL）中的一個(gè)變量。然后，位置轉(zhuǎn)換為字符串，我們可以操縱它。
接下來(lái)，我們“分裂”串成兩部分通過(guò)錨標(biāo)記（#）和隨后查看陣列，從分裂創(chuàng)造大于一項(xiàng)。大于一項(xiàng)意味著URL的錨。
如果URL只有一部分，這意味著沒有錨的存在。隨后的“開關(guān)”聲明載內(nèi)容根據(jù)錨定值。switch語(yǔ)句中有一個(gè)“默認(rèn)”選項(xiàng)，如果沒有錨的存在，這將是在其原始狀態(tài)加載頁(yè)面相同。
此外，我們將代碼來(lái)處理鏈接，直接指向具體內(nèi)容通過(guò)內(nèi)部錨。一個(gè)鏈接，指向“內(nèi)容”將在“內(nèi)容的內(nèi)容加載，“串”#內(nèi)容”將被附加到當(dāng)前頁(yè)面的URL。
這將添加一個(gè)內(nèi)部錨改變URL，不改變頁(yè)面視圖但保留一個(gè)標(biāo)識(shí)符，表示該頁(yè)所需的狀態(tài)。
這種解釋只是理論。作品的概念，它工作得很好。但我沒有說(shuō)所有的可能性，缺點(diǎn)和其他微妙的這樣一個(gè)網(wǎng)站或網(wǎng)頁(yè)建設(shè)。
遵循一個(gè)更全面的專題討論，下面的鏈接，或嘗試它自己。另外，請(qǐng)注意，這可以使用的內(nèi)容，改變與JavaScript單獨(dú)測(cè)試，而不需要利用Ajax。

創(chuàng)新互聯(lián)設(shè)計(jì)文章推薦：

晉寧網(wǎng)站排名、晉寧網(wǎng)站推廣公司

晉寧網(wǎng)站制作、晉寧企業(yè)網(wǎng)站制作

網(wǎng)站搬家數(shù)據(jù)遷移

網(wǎng)頁(yè)名稱：5個(gè)常見的Ajax問題的解決方案
文章源于：http://www.muchs.cn/news/21025.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營(yíng)銷seo公司；服務(wù)項(xiàng)目有解決方案等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)