2011-05-25 33 views
0

我有一個表,我想動態地添加一行。這部分工作正常,我正在使用jQuery插入新行。問題是,該行包含連接到Colorbox彈出窗口的兩個「編輯」和「刪除」鏈接。現有的行對Colorbox可以正常工作,但新行將兩個鏈接附加到「新用戶」Colorbox,而不是根據需要選擇「編輯」或「刪除」彈出窗口。新插入的元素,Colorbox不附加到正確的事件

另一個奇怪的行爲是,一旦你點擊任何一箇舊的鏈接,鏈接就被正確地連接了。步驟重新創建:

  1. 點擊「新增人物」
  2. 點擊「添加」
  3. 點擊「編輯」,爲新行 - 它 顯示添加新用戶顏色框
  4. 點擊「編輯」的 現有行
  5. 現在點擊「編輯」新行之一 - 它正確地顯示在編輯顏色框

我試圖在http://pastebin.com/i8n3t2Yt上創建最簡單的測試用例。如果你想在你的本地機器上運行它,你必須在http://colorpowered.com/colorbox/下載Colorbox JS。

回答

0

由於我使用.clone()創建新行,因此它不克隆附加事件。克隆有一個可選參數.clone([withDataAndEvents]),我相信此前默認爲true,但在1.6中更改。我認爲,因爲Colorbox使用.live()附加事件,所以我不需要爲[withDataAndEvents]指定true,但顯然我確實需要。

0

聽起來像將事件附加到前一行的代碼沒有被執行到後來新創建的代碼。您需要顯式重新運行代碼,或者將回調附加到添加新行時通知的事件。

[編輯看代碼]

好,我剛剛審覈了您的代碼,它肯定是這樣的。你正在使用'ready'方法,只運行一次,然後就是這樣 - 它不會在此後再次觸發。所以任何新節點都沒有附加回調。

+0

當你說我正在使用'ready'方法時,我不確定你的意思。你的意思是(document).ready函數嗎?當然,它只執行一次,但它通過$()。colorbox函數隱式附加事件,它本身使用.live()方法附加事件處理程序。 .live()方法應該適用於所有新創建的元素。 – 2011-05-25 22:59:57

+0

是的,我參考(文檔).ready。它將回調函數附加到已經存在的對象的事件處理程序上,但不會爲那些不存在的對象進行配置。如果您將由(document).ready執行的代碼解壓縮到一個也可作爲回調調用的方法中,那麼當您添加一個新節點時,該代碼將起作用。讓我知道你是如何得到的 – 2011-05-26 14:35:01

+0

正如我所提到的,$()。colorbox函數使用.live()方法來附加事件,所以理論上它應該附加到未來的元素上。 Colorbox中沒有公共方法來重新附加事件,因爲使用.live()應該排除任何需要。 此外,您可以清楚地看到鏈接被連接到一個事件,它恰好是錯誤的事件。 – 2011-05-26 23:04:31