如何在粘贴到可编辑的 div 时从文本中删除样式

Question

我有一个可编辑的 div。我希望当用户复制包含颜色或粗体文本的文本并将其粘贴到我的可编辑 div 中时，只应粘贴纯文本。 我的代码是..

 public void onModuleLoad() {
  final HTMLPanel html = new HTMLPanel("<div id='list'> </div>");
  html.addStyleName("dv");
  html.getElement().setAttribute("contenteditable", "true");

  RootPanel.get().add(html);

  handleFileSelect1();

 }
  public static native void handleFileSelect1()
  /*-{      
    /*-{   
function handleFileSelect(evt){ 
    alert("paste");
}


$doc.getElementById('list').addEventListener('paste', handleFileSelect, true);                                                                                          
 }-*/;

这不起作用。，

Answer 1

使用Element#getInnerText() 可以正常工作，但第一次粘贴的 HTML 有一个例外情况。

HTMLPanel html = new HTMLPanel("<div id='list'> </div>") {
    @Override
    public void onBrowserEvent(Event event) {
        super.onBrowserEvent(event);
        switch (event.getTypeInt()) {
            case Event.ONPASTE: {
                // The Logic is here set inner HTML from the inner Text
                getElement().setInnerHTML(getElement().getInnerText());
                break;
            }
        }
    }
};
html.sinkEvents(Event.ONPASTE);

html.addStyleName("dv");
html.getElement().setAttribute("contenteditable", "true");

注意：你可以朝这个方向思考。同时我也在尝试解决异常情况。