html - CSS：如何制作包含“可提交”表单的列表项？

Question

寻找非 JS 解决方案。说我有这样的事情：

<ul>
   <li>
      <form>
         <fieldset>
            ...
            <input type="submit" value="Submit"/>
         </fieldset>
      </form>
   </li>
   ...
</ul>

有没有办法在没有 JS的情况下执行以下操作：

1. 使提交按钮不可见，并且
2. 使可点击的任何部分<li>（意思是，它将提交表单）

？？？

Answer 1

您可以使用 JS 提交没有 sumbit 按钮的表单：

<li onClick="document.forms["myform"].submit();">my LI</li>
<form id="myform">
<!-- FORM -->
</form>

这只是实现这一目标的快速方法。如果你也在使用 JS 来解决其他问题，你不应该直接实现它（内联）。

更新 - 没有 JS：

如果没有 JS，您肯定需要输入，但您可以根据需要使用 css 对其进行样式设置：

input.submit { border:none; background-color:transparent; display:block; width:200px;
height:200px; position:absolute; }

通过top，left你可以把它放在里。position:relative可能会更好。这取决于你想如何定位它。

<input class="submit" type="submit" />