在jsp中使用标签<a>提交表单不起作用答案

【问题标题】：form submission using tag <a> in jsp not working在jsp中使用标签<a>提交表单不起作用
【发布时间】：2014-07-17 07:47:13
【问题描述】：

我正在尝试使用 html 标记将表单从一个 jsp 提交到另一个 jsp，如下所示：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>SendIt Bank</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link href="css/bank.css" rel="stylesheet" type="text/css">
<script language="JavaScript" type="text/JavaScript">

function checkUserInListAndSubmit() { 
    alert("hello");
    document.getElementById('userLoginForm').submit();
    //document.forms["userLogin"].submit();

}

</script>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<form name="userLoginForm" id="userLoginForm" action="accountdetails.jsp" method="POST">
    <table width="202" height="154" border="0" align="center" cellpadding="5" cellspacing="0" bgcolor="#CCCCCC"> 
      <tr>
        <td colspan="2" valign="bottom" class="headermain">&nbsp;</td>
      </tr>
      <tr>
        <td colspan="2" valign="bottom" class="headermain"><div align="center" class="style4">Online
            Banking Login</div></td>
      </tr>
      <tr>
        <td class="loginbox style5">User ID:</td>
        <td class="loginbox"><input name="userID" type="text" id="userID" size="12" maxlength="20"></td>
      </tr>
      <tr>
        <td width="68" class="loginbox style5">Password: </td>
        <td class="loginbox"><input name="password" type="password" id="password" size="12" maxlength="20"></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td width="103"><div align="left"><a href="JavaScript:checkUserInListAndSubmit()"><img src="images/btn-signin.png" alt="Sign In" name="submit" width="60" height="20" border="0" align="right"></a></div></td>
      </tr>
      <tr>
        <td colspan="2"><p align="center"><span class="style2"><a href="FYP1.html">Forgot
                your Password?</a><br>
        </span> </p></td>
      </tr>
    </table>
</form>
</body>
</html>

当我单击 href 链接时，在我的情况下，我正在单击图像。控制转到 javascript 函数 ()。但是，表单没有被提交。当我尝试在 chrome 中调试时，我在控制台中看到了这个错误。

Uncaught TypeError: object is not a function index.jsp:12
checkUserInListAndSubmit index.jsp:12
(anonymous function)

错误出现在 document.getElementById('userLoginForm').submit(); 请帮我解决这个问题并提交表格。

【问题讨论】：

你没有使用 input type="submit" 的任何原因？
其实没有理由不用输入法。我得到了一个标准模板，其中只有标签。所以，我正在努力实现应该可以实现的目标。

标签： javascript forms jsp

【解决方案1】：

你没有使用 input type="submit" 的任何原因？

这就是你的答案

<form id="userLoginForm'" action="" method="post">
    <a href="JavaScript:checkUserInListAndSubmit()"><img src="images/btn-signin.png" alt="Sign In" name="submit" width="60" height="20" border="0" align="right" onclick="document.getElementById('userLoginForm'').submit();"></a>
</form>

还有

onclick="parentNode.submit();

应该工作

【讨论】：

我这样试过
我在 chrome 控制台中收到两个错误。使用旧错误，我收到此错误 Uncaught TypeError: undefined is not a function index.jsp:49 onclick

【解决方案2】：

从您的标记中删除/重命名属性

name="submit"

也就是说，

  <tr>
    <td>&nbsp;</td>
    <td width="103"><div align="left"><a href="JavaScript:checkUserInListAndSubmit()"><img src="images/btn-signin.png" alt="Sign In" width="60" name="some-other-name" height="20" border="0" align="right"></a></div></td>
  </tr>

查看answer 了解更多信息。

干杯！

【讨论】：

我试过这个
但是，我还是得到这个错误 Uncaught TypeError: object is not a function index.jsp:29 checkUserInListAndSubmit index.jsp:29 (anonymous function)
您是否尝试检查页面并确保名称已更改？尝试用力刷新页面。在我的情况下，重命名属性有效。

【解决方案3】：

试试这个锚标签，

<a href="javascript:{}" onclick="document.getElementById('userLoginForm').submit();">

或者如果你想做更多的js函数，

    <a href="javascript:{}" onclick="checkUserInListAndSubmit();return false;">

更新答案

用 id 指定你的锚点，例如；
```
<a href="#" id="mylink">
```

为锚标签onclick监听器编写js函数

document.getElementById("mylink").onclick = function() {
    //do other coding here
    document.getElementById("userLoginForm").submit();
    return false;
}

【讨论】：

在提交表单之前，我有一些功能要在js函数中实现。所以，我不能直接点击提交。
我尝试了更新的解决方案。我回到了我的第一个错误 :( 仍然没有将表单提交到目标 jsp
我尝试了更新解决方案。通过附加 # 更改 url。但是，表单提交力发生了。我在控制台中看到这个错误 Uncaught TypeError: Cannot set property 'onclick' of null index.jsp:10 (anonymous function)