java - 从gwt调用javascript抛出未定义不是函数

我需要将html模板中的javascript修改为我的gwt代码。
head中的原始代码为：

<script src="assets/js/jquery.js"></script>
<script type="text/javascript" src="assets/js/slimbox.js"></script>
<script type="text/javascript" src="assets/js/slider.js"></script>

<script type="text/javascript">
$(document).ready(function(){
  $("#slider").easySlider({
    auto: true,
    continuous: true,
    controlsShow:    false,
  });
});
</script>

在身体上：

<div id="slider">
  <ul>
    <li><a href="#"><img src="myapp/img/01.jpg" alt="" /></a></li>
    <li><a href="#"><img src="myapp/img/02.jpg" alt="" /></a></li>
    <li><a href="#"><img src="myapp/img/03.jpg" alt="" /></a></li>
    <li><a href="#"><img src="myapp/img/04.jpg" alt="" /></a></li>
    <li><a href="#"><img src="myapp/img/05.jpg" alt="" /></a></li>
  </ul>
</div>

我已经在MyApp.jsp中链接了外部javascript

<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE" />
  <script type="text/javascript" language="javascript" src="myapp/myapp.nocache.js"></script>
  <script type="text/javascript" language="javascript" src="myapp/js/jquery.js"></script>
  <script type="text/javascript" language="javascript" src="myapp/js/slimbox.js"></script>
  <script type="text/javascript" language="javascript" src="myapp/js/slider.js"></script>
</head>

然后我有了MainPage.java，该创建是由History处理的

public MainPage() {
    initWidget(uiBinder.createAndBindUi(this));
    RootLayoutPanel.get().clear();
    RootLayoutPanel.get().add(this);
    onLoadSlider();
}

public static native void onLoadSlider() /*-{
    $("#slider").easySlider({
    auto: true,
    continuous: true,
    controlsShow: false,
});
}-*/;

调用onLoadSlider函数结果为异常：onLoadSlider()([]): $ is not defined

然后我尝试使用window.top.document.getElementById("slider")代替$("#slider")，现在例外是onLoadSlider()([]): undefined is not a function

最佳答案

如您在official dev guide for JSNI中所读，您必须在此处添加$wnd：

$wnd.$("#slider").easySlider({
    auto: true,
    continuous: true,
    controlsShow: false,
});

从JSNI访问浏览器的窗口和文档对象时，必须分别将它们引用为$ wnd和$ doc。您已编译的脚本在嵌套框架中运行，并且$ wnd和$ doc会自动初始化以正确引用宿主页面的窗口和文档。