伙计们，我正试图把两个按钮从两个不同的形式在同一行。我试着在两个按钮上放一个id，这样我就可以在css中管理它们。特别地，我要做的是放上"delete"按钮旁边的"更新"按钮。按钮。这就是我想做的，但它不起作用，因为"delete"按钮保持在"update"按钮。
//First form
<form action="../updatecustdet" method="post">
<pre>
<c:forEach var="customer" items="${listCustomer}">
<input type="hidden" name="id" value="${customer.id}" />
.
.
.
.
<input type="submit" id="up" value="Update" />
</c:forEach>
</pre>
</form>
//Second form
<form action="../deletefromdetailslist" method="POST">
<input id="cust" name="customer" type="hidden" value="${customer.id}"/>
<input type="submit" id="de" value="Delete"/>
</c:forEach>
</form>#up {
padding:5px 15px;
background:#ccc;
border:0 none;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
display:inline-block;
}
#de {
padding:5px 15px;
background:#ccc;
border:0 none;
cursor:pointer;
-webkit-border-radius: 5px;
border-radius: 5px;
top:-43px;
}衷心感谢那些帮助过我的人
从form元素中删除按钮，并将它们放置在第二个表单下面。同时给这两个表单一个唯一的id，这样你的HTML现在匹配:
<form id="update" action="../updatecustdet" method="post">
<pre>
<c:forEach var="customer" items="${listCustomer}">
<input type="hidden" name="id" value="${customer.id}" />
.
.
.
.
</c:forEach>
</pre>
</form>
<form id="delete" action="../deletefromdetailslist" method="POST">
<input id="cust" name="customer" type="hidden" value="${customer.id}"/>
</c:forEach>
</form>
<input type="submit" id="up" value="Update" />
<input type="submit" id="de" value="Delete"/>
将以下javascript放在<body>的底部，否则按钮将不起作用:
<script>
document.getElementById('up').addEventListener('click', () => document.getElementById('update').submit());
document.getElementById('de').addEventListener('click', () => document.getElementById('delete').submit());
</script>
如果您的浏览器不支持ECMA6，请使用以下javascript:
<script>
document.getElementById('up').addEventListener('click', function() {
document.getElementById('update').submit();
});
document.getElementById('de').addEventListener('click', function() {
document.getElementById('delete').submit();
});
</script>
你的CSS很好，不需要修改
我可能在胡说八道，但我很确定form.submit()是HTTP标准化API的一部分，因此它应该触发单个GET/POST/WHATEVER HTTP协议步骤。
https://www.rfc-editor.org/rfc/rfc2068部分- 9.5
<form id="update" action="../updatecustdet" method="post">
<pre>
<c:forEach var="customer" items="${listCustomer}">
<input type="hidden" name="id" value="${customer.id}" />
.
.
.
.
</c:forEach>
</pre>
</form>
<form id="delete" action="../deletefromdetailslist" method="POST">
<c:forEach var="customer" items="${listCustomer}">
<input id="cust" name="customer" type="hidden" value="${customer.id}"/>
</c:forEach>
</form>
<input type="submit" id="up" value="Update" />
<input type="submit" id="de" value="Delete"/>
<script>
document.getElementById('up').addEventListener('click', function() {
document.getElementById('update').submit();
});
document.getElementById('de').addEventListener('click', function() {
document.getElementById('delete').submit();
});
</script>
</body>
</html>