亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

UpdatePanel和Jquery沖突的解決方法

 更新時間:2013年04月01日 18:24:01   作者:  
在第一次頁面加載時,元素A的X效果正常,點擊B之后,頁面局部刷新,此時,回到A,元素A失去X效果.后來了解了下頁面應(yīng)用了ASP.NET AJAX局部刷新,這就明朗了,估計是和JQUERY沖突了

在第一次頁面加載時,元素A的X效果正常,點擊B之后,頁面局部刷新,此時,回到A,元素A失去X效果.

開始以為是前端我這到程序員那里出現(xiàn)問題,但仔細檢查之后發(fā)現(xiàn)沒有,后來了解了下頁面應(yīng)用了ASP.NET AJAX局部刷新,這就明朗了,估計是和JQUERY沖突了。

問題重現(xiàn): 1.ASP.NET AJAX在頁面中添加ScriptManager和UpdatePanel
2.在UpdatePanel中添加元素A
3.用jQuery對元素A添加X效果
4.在UpdatePanel中加一個Button B用作postback

這樣問題就出現(xiàn)了。
分析1: UpdatePanel在應(yīng)用中主要用于局部刷新,避免整個頁面的Postback。UpdatePanel實現(xiàn)局部刷新的核心在于MicrosoftAjaxWebForm.js文件,它的局部刷新過程就是將頁面提交到服務(wù)端(包含ViewState),執(zhí)行服務(wù)端代碼后異步將在UpdatePanel內(nèi)的HTML進行重新呈現(xiàn)。在此過程中,頁面的其它部分并沒有狀態(tài)更改。

分析2: jQuery可以通過簡單的代碼對HTML元素添加各種屬性和事件句柄,我們可以在這里看到官方的文檔: Tutorials:How jQuery Works

在這里,我們可以得知,jQuery有個重要的事件標(biāo)記“ready”,一般對HTML元素的效果和事件句柄都通過這個ready事件來添加,如下: $(document).ready(function () { $(“p”).text(“The DOM is now loaded and can be manipulated.”); });

官方對此的說明是:ready事件會在DOM完全加載后運行一次,OK,至此,問題的原因差不多明白了:

原因: 因為在UpdatePanel局部刷新之后,其中的元素A被重寫,而此時整個DOM樹并沒有重新加載,所以jQuery的ready事件并沒有觸發(fā),所以元素A就失去了原有的特效。

解決方案: 我們可以將ready事件中執(zhí)行的代碼提取出來,然后通過捕獲ScriptManager的EndRequest事件,在每次UpdatePanel局部刷新之后執(zhí)行一次jQuery初始化代碼,如下所示: <script type=”text/javascript” > function slide(){ //here is code } function load() { Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler); } function EndRequestHandler() { slide(); } </script >

最后就是需要 添加 <body onload="load()" >

相關(guān)文章

  • 基于jquery實現(xiàn)簡單的手風(fēng)琴特效

    基于jquery實現(xiàn)簡單的手風(fēng)琴特效

    這篇文章主要介紹了基于jquery實現(xiàn)簡單的手風(fēng)琴特效,需要的朋友可以參考下
    2015-11-11
  • jQuery圖片切換動畫特效

    jQuery圖片切換動畫特效

    這篇文章主要為大家詳細介紹了jQuery圖片切換動畫特效,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2016-11-11
  • jQuery實現(xiàn)無限往下滾動效果代碼

    jQuery實現(xiàn)無限往下滾動效果代碼

    這篇文章主要介紹了jQuery實現(xiàn)無限往下滾動效果代碼,涉及jQuery基于ajax交互操作數(shù)據(jù)庫數(shù)據(jù)及頁面元素動態(tài)變換的相關(guān)技巧,需要的朋友可以參考下
    2016-04-04
  • jquery tools 系列 scrollable學(xué)習(xí)

    jquery tools 系列 scrollable學(xué)習(xí)

    今天繼續(xù)jquery tools六大功能之第三功能 scrollable的學(xué)習(xí)。一如既往,首先給出操作的html代碼 此html代碼修改自jquery tools官方網(wǎng)站demo代碼
    2009-09-09
  • jQuery綁定事件的四種方式介紹

    jQuery綁定事件的四種方式介紹

    jQuery中提供了四種事件監(jiān)聽方式,分別是bind、live、delegate、on,對應(yīng)的解除監(jiān)聽的函數(shù)分別是unbind、die、undelegate、off。下面通過本文逐一給大家詳細介紹,感興趣的朋友一起看看吧
    2016-10-10
  • jQuery 獲取兄弟元素的幾種不錯方法

    jQuery 獲取兄弟元素的幾種不錯方法

    這篇文章主要介紹了jQuery 獲取兄弟元素的幾種不錯方法,需要的朋友可以參考下
    2014-05-05
  • Web前端設(shè)計模式  制作漂亮的彈出層

    Web前端設(shè)計模式 制作漂亮的彈出層

    Ben最近在負責(zé)一個購書網(wǎng)站,在網(wǎng)站的首頁上,有一個叫做“最新上架”的板塊,板塊的內(nèi)容比較簡單,只有書籍名稱,作者姓名和上架時間(如圖),當(dāng)初設(shè)計的時候并i沒有過于豐富的構(gòu)思
    2010-10-10
  • jQuery制作可自定義大小的拼圖游戲

    jQuery制作可自定義大小的拼圖游戲

    這篇文章主要介紹了jQuery制作可自定義大小的拼圖游戲的代碼,非常的簡單實用,雖然還只是局限于數(shù)字順序的拼圖,后續(xù)慢慢完善上圖片,但還是分享給大家,有需要的小伙伴可以參考下。
    2015-03-03
  • Javascript 鏈?zhǔn)秸{(diào)用實現(xiàn)代碼(參考jquery)

    Javascript 鏈?zhǔn)秸{(diào)用實現(xiàn)代碼(參考jquery)

    謂的鏈?zhǔn)秸{(diào)用無非是一個語法技巧而已,我就學(xué)Jquery寫了一個粗淺的庫。
    2010-05-05
  • jquery attr方法獲取input的checked屬性問題

    jquery attr方法獲取input的checked屬性問題

    如果使用jquery,應(yīng)使用prop方法來獲取和設(shè)置checked屬性,不應(yīng)使用attr,需要的朋友可以參考下
    2014-05-05

最新評論