Question

我需要一种方法来使用div作为提交按钮将表单请求发送到Servlet，或者是否有其他方法可以解决我的问题。 “logoutbutton”是div。

<div class="logoutbutton">
     <table width="100%">
        <tr>
           <td width="50px"><img src="img/usericon.png" width="44" height="44" /></td>
           <td><a style="font-size:12px; font-family:Verdana, Geneva, sans-serif; color:#FFF"><% out.print(session.getAttribute("userid")); %></a><br />
              <a style="font-size:20px; font-family:Verdana, Geneva, sans-serif; color:#FFF">Log Out</a>
           </td>
        </tr>
     </table>
</div>

Answer 1

您需要调用处理该链接的注销操作的servlet。你可以用

来做

<a href = "LogourServletUrlPattern"> Logout </a>

执行此操作后，您可以从doGet

的LogoutServet方法退出

Answer 2

我会使用jquery，然后在DOM对象上侦听事件是件小事。

$(".logoutbutton").click(function () {
      window.location.href = 'logout.url';
});

或

$(".logoutbutton").click(function () {
      $.post( "logout.url" );
});

Answer 3

这很简单，使用'onclick'事件：

<div style="cursor:pointer;" onclick="submitForm();">...</div>

在onclick上你也可以使用

window.location.href='LogourServletUrlPattern';

如果你不想调用函数并直接调用sevlet

Answer 4

将您的DIV作为表单的一部分，并点击DIV

提交表单

<html>
<head>
<script>
function formSubmit()
{
document.getElementById("frm1").submit();
}
</script>
</head>
<body>

<form id="frm1" action="form_action">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<div class="logoutbutton" onclick="formSubmit()">
     <table width="100%">
        <tr>
           <td width="50px"><img src="img/usericon.png" width="44" height="44" /></td>
           <td><a style="font-size:12px; font-family:Verdana, Geneva, sans-serif; color:#FFF"><% out.print(session.getAttribute("userid")); %></a><br />
              <a style="font-size:20px; font-family:Verdana, Geneva, sans-serif; color:#FFF">Log Out</a>
           </td>
        </tr>
     </table>
</div>
</form>

</body>
</html>

Answer 5

使用jquery轻松实现此目的。

在DOM中

  <div id="logout-button">Logout</div>

在javascript / jquery

中

$("#logout-button").click(function () {
   alert("ajax call to end session");
});

即使你不使用jquery，你也可以使用上面的内容来了解如何实现这个目标。

Answer 6

您可以使用javascript捕获logoutbutton div上的click事件并提交表单。假设您的表单中包含id＆＃39; myform＆＃39;：

<div class="logoutbutton" onclick="document.getElementById('myform').submit()">

请注意，使用此方法，div不会被浏览器视为超链接，因此您无法右键单击并在新标签中打开。

如果您的javascript变得复杂，请考虑使用jquery等库。

在JSP Servlets中使用div作为提交按钮

6 个答案: