1

我想在主div中加载不同的gwt模块，基于点击相应的menuItem。我想使用 JQuery。在下面的代码中，我想加载，fooGwt module如果我们点击loadFooModule，同样，如果我点击loadJqueryModule链接，那么JQuery gwt module应该加载。

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="menuItem" uri="menuItem" %>
<html>
 <head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>
  $(document).ready(function() {
    $("a").click(function() {
          $("#fooModule").empty();
          $("#jQueryModule").empty();
      $("#main").remove();
          alert($(this).text());
          if ($(this).text() == "loadJqueryModule") {
                  // Jquery gwt module.
              $('head').append($("<script id='main' src='/jquery/jquery.nocache.js' />")); 
          } else {
                   // Foo GWt module.
              $('head').append($("<script id='main' src='/foo/foo.nocache.js' />")); 
          }
    });
  });
   </script>
 </head>
 <body>
   <h1>Web Application Starter Project</h1>
    <a href="#" id="clickMe">loadFooModule</a>
    <a href="#" id="clickMe5">loadJqueryModule</a>
    <div id="fooModule">
    </div>      
    <div id="jQueryModule">
    </div>      
 </body>
</html>

O/p：在这里它正在加载一个模块，它是 Foo。另一个模块没有加载。

4

2 回答 2

1

要动态加载模块，您必须注意两件事：

  1. xsiframe使用链接器编译模块
  2. <script>使用标签插入它。

几天前我确实回答了一个类似的问题：如何动态加载 gwt 生成的 nocache.js 文件？. 查看它以了解有关这些约束的更多信息。

您动态插入的 js 代码script似乎没问题，因此请检查两个模块是否是使用xsiframe链接器编译的。

于 2013-05-31T16:39:41.560 回答
0

你的方法感觉是反话。您希望 GWT 控制网页，然后您可以使用代码拆分https://developers.google.com/web-toolkit/doc/latest/DevGuideCodeSplitting来控制每个模块的加载时间。

于 2013-05-31T16:00:01.463 回答