1

それぞれのメニュー項目のクリックに基づいて、メイン div にさまざまな gwt モジュールをロードしたいと思います。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 である 1 つのモジュールをロードしています。他のモジュールがロードされていませんでした。

4

2 に答える 2