0

我几乎不知道如何使用 AJAX 和 jQuery,或者它是如何工作的,但我想使用 Struts 2 框架制作一个简单的登录 webapp。

我从网上得到了一个登录页面模板,如下所示:

<html>
<head>
  <link href="css/style.css" rel="stylesheet" type="text/css" />

  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function() {
      $(".username").focus(function() {
          $(".user-icon").css("left","-48px");
      });
      $(".username").blur(function() {
          $(".user-icon").css("left","0px");
      });

      $(".password").focus(function() {
          $(".pass-icon").css("left","-48px");
      });
      $(".password").blur(function() {
          $(".pass-icon").css("left","0px");
      });
    });
  </script>
</head>

<body>
  <div id="wrapper">
    <div class="user-icon"></div>
    <div class="pass-icon"></div>

    <form name="login-form" class="login-form" action="" method="post">
      <div class="header">
        <h1>Login Form</h1>
        <span>
          Fill out the form below to login to my super awesome imaginary control panel.
        </span>
      </div>

      <div class="content">
        <input name="username" type="text" class="input username" value="Username" onfocus="this.value=''" />
        <input name="password" type="password" class="input password" value="Password" onfocus="this.value=''" />
      </div>

      <div class="footer">
        <input type="submit" name="submit" value="Login" class="button" />
        <input type="submit" name="submit" value="Register" class="register" />
      </div>
    </form>
  </div>

  <div class="gradient"></div>
</body>
</html>

为了使用该框架,我包含了 tag-libs 指令并将文件重命名为 .jsp 类型,然后将<form>标签更改为<s:form>and </s:form>

之后,它会丢失模板的格式。我下载了 struts2-jquery 插件 jar 并尝试使用<sj: form>,但导致编译错误。

如何在不丢失模板格式和设计的情况下使用 struts 标签?

编辑:

http://imgur.com/GKV4b0P,51RmXhP

在这里您可以看到当我编辑<form>and</form><s:form>and</s:form>并添加 tag-lib 页面指令时会发生什么:

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>

我还将扩展名更改为 .jsp 并没有编辑其他内容。

4

2 回答 2

0

利用

<s:form name="login-form"  theme="simple" class="login-for...
于 2013-06-05T10:34:02.840 回答
0

Struts2 使用Themes 来生成 HTML

对于每个主题,相同的Struts2 标记(如<s:select/>)将生成不同的HTML。

默认主题(未指定时应用的主题)是XHTML Theme

有了它,标签

<s:select key="personBean.sport" list="sports" />

将生成以下 HTML:

<tr>
  <td class="tdLabel">
    <label for="save_personBean_sport" class="label">Favorite sport:</label>
  </td>
  <td>
    <select name="personBean.sport" id="save_personBean_sport">
      <option value="football">football</option>
      <option value="baseball">baseball</option>
      <option value="basketball" selected="selected">basketball</option>
    </select>
  </td>
</tr>

在这里您可以找到四个开箱即用主题的列表

如有必要,您甚至可以自己卷起来。

就我个人而言,我更喜欢Simple 主题,它会生成尽可能少的 HTML,让您在标签周围生成 HTML。

要在标签中使用它,只需像这样添加它:

<s:select ... theme="simple" />

要将其设置为项目中所有 JSP 的默认主题,请将以下行放入 struts.xml 文件中:

<constant name="struts.ui.theme" value="simple" />

要将CSS 类添加到Struts2 标记,请始终使用cssClass而不是class;

要将内联样式添加到Struts2 Tag,请始终使用cssStyle而不是style


现在,您拥有了绘制组件所需的一切:生成的 HTML 和 CSS 由您决定。

于 2013-06-05T12:03:32.560 回答