2011-08-19 141 views
1

我的公司有一個構建在ASP.NET中的Web應用程序,他們要求我爲他們已有的儀表板頁面編寫一個小部件代碼。這些小部件是在運行時動態加載的自定義用戶控件。我的問題是我有一些自定義的JavaScript,需要運行每一個小部件加載。如何在jQuery中通過AJAX加載DOM運行DOM功能?

$(function() 
{ 
    // Setup widget. 
}); 

這在第一次加載儀表板頁面時很有用。我的DOM就緒功能運行,一切都很好。但是,每當用戶在儀表板上移動小部件時,所有小部件都位於更新面板中,並且它們都使用AJAX重新加載。 DOM準備好的功能在通過AJAX插入頁面時不會運行。

有關如何確保每次加載小部件時都會運行此代碼的任何建議?

回答

1

我解決這個問題的方法是,當您在加載時定義它們時,命名給定的事件出價。然後,在ajax的回調函數中取消設置這些事件,並將它們全部設置爲新創建的dom元素。

+0

我的問題是我無法控制小部件的加載方式。不幸的是,我只能在小部件的範圍內工作。如果我可以修改ajax電話,我肯定會。 – Chev

+0

啊,嗯。這很棘手。我不能說我以前曾嘗試過這樣做。 iframes不是一個選項嗎?也許你可以讓這些腳本在懸停而不是加載時運行?這會起作用嗎?也許你可以讓那些最初運行的函數動態地將腳本加載到頁面頭部,然後以某種方式監聽Ajax重新洗牌事件?我不知道這是否使一切變得更容易或更難... – Hoatzin

+0

絕妙的主意。我會給它一個旋轉。 – Chev

0

將HTML寫入DOM後,每個窗口小部件都可以調用設置函數。

+0

這不正是我問怎麼辦?我試過在widget的底部包含一個不包含DOM的腳本。這會在頁面加載時觸發,但不會在通過ajax重新加載時觸發。 – Chev

+0

DOM準備就緒 - 初始頁面呈現時。當有迴流或重繪時,它不會停止「準備好」。你可以做的只是查詢DOM,看看你的元素在執行代碼之前是否存在。 –

+0

謝謝你重新解釋我已經解釋過的問題。 – Chev

0

當你做你的Ajax調用有返回功能執行的設置代碼

$.post(url, {/*data*/}, function() { 
    // return function call 
    // do setup code 
}); 

編輯:

因爲你沒有控制你可以有一個處理攔截AJAX調用:

$(#your-widget-area).ajaxComplete(function(e, xhr, settings) { 

}); 

你可以在這裏找到文檔:http://api.jquery.com/ajaxComplete/

+0

查看關於Hoatzin的回​​答的評論。聽起來像沒有這種控制,我可能會被擰緊。 – Chev