GWT節點或元素偵聽onAttach事件

Question

有沒有辦法處理GWT節點中的onAttach事件？我想我可以這樣做：

Node myDiv = DOM.createDiv(); 
Magic.setOnAttachEventListener(myDiv, new EventListener() { 
    @Override 
    public void onEvent(Event event) { 
    // ... 
    } 
} 

當我做這樣的事情的處理程序應被調用，

parent.appendChild(myDiv); 

鑑於parent連接本身，即，它會顯示在當前窗口。

Answer 1

我張貼我的第二個答案，因爲現在我知道你不能改變如何將DIV添加到父項。

經過一番搜索，我找到了Mutation events。它們允許你聽DOMNodeInserted事件：

JS：

myDiv.addEventListener("DOMNodeInserted", function (ev) { 
    alert('added'); 
}, false); 

在GWT需要使用JSNI方法：

private native void addListener(Element elem) /*-{ 
    elem.addEventListener("DOMNodeInserted", function (ev) { 
     $wnd.alert('added'); 
    }, false); 
}-*/; 

它的工作原理，但...它過時。您應該使用MutationObserver。

不幸的是MutationObserver沒有NodeInserted事件被觀察到。我認爲subtree突變觀察會做這項工作，但它並沒有爲我工作。解決的辦法是觀察父childList突變：

JS：

// create an observer instance 
var observer = new MutationObserver(function(mutations) { 
    mutations.forEach(function(mutation) { 
     alert(mutation.type); 
    });  
}); 

// configuration of the observer: 
var config = { 
    childList: true 
}; 

// pass in the target node, as well as the observer options 
observer.observe(elem, config); 

，並再次爲GWT你需要用它在JSNI方法（你知道如何）。

觀察者回調中的參數mutation是MutationRecord對象。

所以，如果你能得到父母，使用MutationObserver並觀察childList突變。如果不是，請嘗試使用已棄用的突變事件。

---

我知道這不是純粹的GWT解決方案，但可以使用GWT方法處理事件或突變。你只需要調用GWT方法形式JSNI這樣的：

[instance-expr.]@class-name::method-name(param-signature)(arguments) 

你會發現在GWT documentation所有JSNI信息。

Answer 2

您可以使用SimplePanel或HTMLPanel作爲其內容均使用DIV。

在面板上，您可以撥打​​方法。

如果您需要Element您可以在面板上調用getElement()方法。

此方法僅如果附加myDiv作爲一個小組，這樣反而

parent.appendChild(myDiv); 

你應該這樣做

HTMLPanel.wrap(parent).add(myDiv); 

下面是一個例子代碼：

Element parent = RootPanel.getBodyElement(); 
    SimplePanel myDiv = new SimplePanel(); 

    // use it as Panel 
    myDiv.add(new Label("Hello!")); 

    // or use it as an element 
    myDiv.getElement().setInnerText("Hello 2!"); 

    myDiv.addAttachHandler(new Handler() { 
     @Override 
     public void onAttachOrDetach(AttachEvent event) { 
      Window.alert("Attached"); 
     } 
    }); 

// parent.appendChild(myDiv.getElement());  // this will not fire the AttachEvent 
    HTMLPanel.wrap(parent).add(myDiv);   // this will fire the AttachEvent 

Answer 3

GWT中的所有Widget已實施HasAttachHandlers interf高手。如果您需要此功能，則最好使用Widget而不是Node。

Answer 4

也有「投票」的替代方法，可能不是很有效，但更容易，見https://stackoverflow.com/a/850995/938899。