JSNI(GWT-GWTP):在准备好事件触发后,jQuery不会在“文档就绪”function中选择节点

我试图根据其CSS ID选择一个div节点,并使用jQuery (2.2.0)更改div的文本。 我的问题是jQuery选择似乎永远不会发生?

  • jQuery选择代码(下面,我使用’$’简写’jquery’fucntion )在一个标准的’ 文档就绪 ‘回调函数中,以便具有CSS ID的div被“确保”保证在DOM中到调用回调时。 那个js代码和它的标准JSNI $ wnd语法类似于来自JSNI GWT jquery的Answers。
  • 所有这些jQuery js都在GWT JSNI本机方法(GWT 2.7.0)中。
  • 我的项目是GWTP (1.5.1)项目。
  • 所有观察结果都在不同的浏览器中以及生产模式和开发模式中重现。

我将从这段代码中解释如何确认JSNI本机方法renderTree()被调用,’document ready’事件触发,而带有CSS ID的div在DOM中

public native void renderTree()/*-{ $wnd.alert("renderTree"); $wnd.$($doc).ready(function() { $wnd.alert("DOM ready!"); $wnd.$('#gramTree').text("text changed from JSNI jQuery"); }); }-*/; 
  1. 我从GWT View类的构造函数中调用renderTree()(更具体地说,它是一个GWTP扩展的ViewWithUiHandlers )
  2. 加载View的页面时,会在一个警告窗口中弹出“renderTree”:这certificate了我想要的时候调用renderTree()JSNI方法 ,因为renderTree的第一行是$ wnd.alert。
  3. 紧接着,“DOM就绪!” 弹出一个警告窗口:这certificate‘document ready’事件触发并调用其回调 。 这是因为回调是在renderTree()JSNI中注册到事件的,而回调的第一行是$ wnd.alert
  4. 到目前为止,1.-3。 一切都按预期发生…… 但jQuery $选择’#gramTree’似乎永远不会发生 ,因为具有该ID的div从未将其文本更改为“文本从JSNI jQuery更改”(其文本从UiBinder最初加载为“从UiBinder初始化的文本“,并保持这种方式)。

    • 我预计选择应该发生,因为它是’document ready’回调中的第二行,并且3.certificate了回调被调用。
    • ID为#gramTree的div确实在DOM中,因为我可以在浏览器检查器中看到它,并且我可以看到它的初始文本(“从UiBinder初始化的文本”)呈现。 该初始文本应该从’document ready’回调更改为“从JSNI jQuery更改的文本”。 div,它的CSS ID和它的初始文本在我的View的GWT UiBinder中声明。
  5. 我可以通过在浏览器控制台上手动输入jQuery代码行来手动获取要更改的文本,这些代码行似乎无法从回调中运行( $('#gramTree').text("text changed from JSNI jQuery"); )。 类似地,我也可以通过编写renderTree()来手动工作,从页面上的按钮的click事件调用,并在此时手动单击该按钮。

任何想法在这里出了什么问题?

似乎是通过有根据的猜测,给出了4.-5。,有些东西不适合“文件就绪”事件,或者我如何处理它?

有什么想法可以进一步检查吗?

谢谢!

您应该依赖View Lifecycle以确保它附加到DOM。 来自GWTP ViewImpl#onAttach doc

视图附加到DOM后调用的方法。 您应该重写此方法以执行任何ui相关的初始化,这些初始化需要在附加视图之后完成,并且演示者不必知道(例如,附加事件处理程序)

在你的情况下,当$wnd.$('#gramTree').text("text changed from JSNI jQuery"); 被称为#gramTree元素没有附加到DOM并且对jQuery不可见。

发布此答案我自己作为思考的食物(它是hackish),我在其他地方找到:从Deferred ScheduledCommand调用JSNI renderTree()方法。

似乎“准备就绪”的方法我试图开始工作将是真正的规范/预期的方式来做到这一点。 所以我宁愿把它弄清楚……